@extends('layout.basic_front')

@section("content")
    <div class="col-md-12 look_container" style="padding-bottom:60px;">    
        <div class="col-md-10 col-md-offset-1">
            <div class="row">
                <div class="col-md-3 page_title" style="padding-right:40px;">
                    <h2>USER</h2><h2 style="margin-top:-10px;">INFO</h2>
                </div>


                <div class="col-md-6 text-center">
                    <div style="margin:30px 0px;">
                            <a href="#" >
                                {{ HTML::image($user->img_path,"",['class'=>"img-circle",'style'=>'width:100px;height:100px']) }}
                            </a>
                            <h1 style="clear:both;margin-bottom:30px;">{{$user->name}}</h1>
		 @if($user->login_type != 'Facebook')
                            <a href="#" class="btn btn-default social_btn" id="UserEdit"><img style="margin-bottom: 2px;" height="20" src="{{asset('images/icons/icon_setting.png')}}" /><span id="like" class="like_count_button liked">編輯個人資料</span></a>
		
		 @else
			<a href="#" class="btn btn-default social_btn disabled"><img style="margin-bottom: 2px;" height="20" src="{{asset('images/icons/icon_setting.png')}}" /><span class="like_count_button liked">編輯個人資料</span></a>
		 @endif
                    </div>

                </div>
            </div>

        </div>
    </div>

    <div class="col-md-12 looker_info_ban">
        <div class="col-md-4 col-md-offset-4 text-center">

            <div class="col-xs-6 left_wave">
                <a href="#post_tab" id ="posts_tab" ><p>Favorate Posts</p>
                <h2>{{$collect_num}}</h2>
		</a>
            </div>
            <div id="follower" class="col-xs-6">
                <a href="#follows_tab" id ="follows_tab" ><p>Look</p>
                <h2>{{$follow_num}}</h2>
		</a>
            </div>

        </div>
    </div>

	<div class="col-md-12 comments look_container">
            <div class="col-md-10 col-md-offset-1">

            <div class="col-md-10 col-md-offset-1 page_title" style="padding-bottom:20px;" id ="anchor">
	<div  id='articles'>
		@foreach($articles as $article)
                @if($_FRONTCONST["COL_COUNT"] % 3 ==1)
                    <div class="row">
                @endif
                        <div class="window col-md-4">
                          <div class="post">
                            <div>
                                <div class="col-xs-2 narrow">
                                <a href="{{URL::to('front/lookerinfo/'.$article->blogger_id)}}">
                                     {{ HTML::image($article->blogger_img,"",['class' => "media-object img-circle img-responsive"]) }}
                                    <!--img class="media-object img-circle" src="../../images/head.jpg"-->
                                </a>

                                </div>
                                <div class="col-xs-6 narrow">
                                    <div style="margin-left:7px;">
                                        <p class="looker_name media-heading">{{$article->blogger_name}}</p>
                                        <p class="post_date">{{date("Y/m/d",strtotime($article->created_at))}}</p>
                                    </div>

                                </div>
                                <div class="col-xs-4 narrow">
                                    <a class='like' href="#like" onclick="oneAction('ARTICLE','{{$article->id}}','LIKE','{{$article->blogger_id}}');" >
                                    <img id = "ARTICLE_{{$article->id}}" style="margin-bottom: 2px;" height="16" class="like_btn" src="{{asset('images/icons/icon_like_off.png')}}"/>
                                    <span class="like_count" id="like_{{$article->id}}">{{$article->likes}}</span>
				   </a>
                                </div>
                            </div>
			   <div class="text-overflow">
                                    <a href="{{URL::to('front/video/'.$article->id)}}">
                            <span class="post_title">{{$article->title}}</span>
                                    </a>
			   </div>
                                    <a href="{{URL::to('front/video/'.$article->id)}}">
                           <div class="screen">
                                <div class="product">
                                    {{ HTML::image($article->img_path,"",['class' => "media-object",'style'=>'width:100%;']) }}

                                     <img class="newest_post" src="{{asset('images/icons/new_bg.png')}}">
                                    <!--img src="../../images/product.jpg"-->
                                </div>
				<div class="cover">
                                    <img style="margin-top: 45%;" src="{{asset('images/icons/logo_white.png')}}" />
                                </div>
                            </div>
                                    </a>
                          </div>
                        </div>

                @if($_FRONTCONST["COL_COUNT"] % 3 ==0 || $_FRONTCONST["COL_COUNT"] == count($articles))
                    </div><br>
                @endif
                		@endforeach
	@if($load_start != 'all')
        <div class="col-xs-12 text-center text_wave" style="margin-top:50px;">
            <a href="{{URL::to('front/profile/'.$load_start.'#anchor')}}"><span>LOOK&nbsp;&nbsp;MORE</span></a>
        </div>
	@endif
	
	</div> <!--id = articles-->

        <!-- follower -->
        <div id="follower" class="col-md-12">
        <div id="follower2">
                @foreach($follows as $follow)
                <div class="follower_list text-center">
                         <a href="{{URL::to('front/lookerinfo/'.$follow->id)}}">
                        {{ HTML::image($follow->photo,"",['class' => "img-circle",'style'=>'width:100%;']) }}
                        </a>
                </div>
                @endforeach
            </div>
       </div>
        <!-- end follow -->

        </div>
      </div>
   </div>

<div class="col-lg-12 login_wraper hidden">
    <div class="col-lg-6 col-lg-offset-3 login">
        <div class="col-lg-12 page_title" style="border:1px solid #555;height:100%;    float: left;">
              <div class="col-lg-10 col-lg-offset-1 text-center">
                <h2>PERSONAL INFORMATION</h2>
              </div>
              <div class="col-lg-12">
                @if($errors->any())
                  <div class="col-lg-12 alert alert-danger">
                    <button type="button" class="close" data-dismiss="alert">&times;</button>
                    <strong>錯誤!</strong> {{$errors->first()}}
                  </div>
                @endif
                  <hr class="point">
              </div>

              <div class="col-lg-12 ">


                <div class="col-md-4" style="margin-bottom:0px;">
                <form enctype="multipart/form-data" action="{{URL::to('front/useredit')}}" method="post" style="padding-bottom:30px;">
                  <input name="img_path" type="file" onchange="loadFile(event)">
		  {{ HTML::image($user->img_path,"",['style'=>'width:100px;margin-bottom:10px','id'=>"img_show"]) }}
                  <button style="width:100%;margin-bottom:30px;" type="sumbit" class="btn btn-default">Upload Photo</button>
                </form>    
                </div>
                    <div class="col-md-8">
                      <form enctype="multipart/form-data" action="{{URL::to('front/useredit')}}" method="post" style="padding-bottom:30px;">
                        <div class="form-group">
                          <label>變更使用者名稱</label>
                          <input style="height:45px;" name = "user_name" type="text" class="form-control" id="exampleInputEmail1" value="{{$user->name}}">
                        </div>
                        <div class="form-group">
                          <label>變更密碼</label>
                          <input style="height:45px;" name = "pre_password"  type="password" class="form-control" id="exampleInputPassword1" placeholder="原密碼">
                        </div>
                        <div class="form-group">
                          <input style="height:45px;" name = "new_password" type="password" class="form-control" id="exampleInputPassword1" placeholder="新密碼">
                        </div>
                        <div class="form-group">
                          <input style="height:45px;" name = "check_password" type="password" class="form-control" id="exampleInputPassword1" placeholder="確認新密碼">
                        </div>
                        
                        
                        <button type="submit" class="btn btn-default social_btn">確認</button>
                      </form> 
                  </div>
              </div>

        </div>
    </div>        




</div>
<script>
$(function(){
$('#follower2').fadeOut();

@if($errors->any())
    $('.login_wraper').removeClass( "hidden" );
    $('.hidelogin').fadeIn();
@endif
});
        $("#posts_tab").click(function(){
                $('#articles').fadeIn();
                $('#follower2').fadeOut();
        });
        $("#follows_tab").click(function(){
                $('#articles').fadeOut();
                $('#follower2').fadeIn();
        });
</script>
<script>

        //點黑色遮罩，隱藏LOGIN

        $('.login').mouseenter(function(){
            $('.login_wraper').removeClass( "hidelogin" );
        });

        $('.login').mouseleave(function(){
            $('.login_wraper').addClass( "hidelogin" );
        });

        $('.login').click(function(){
            $('.login_wraper').css('display','block');

        });

        $('.login_wraper').click(function(){
            $('.hidelogin').fadeOut();
        });

	//點擊編輯
        $('#UserEdit').click(function(){
            $('.login_wraper').removeClass( "hidden" );
            $('.hidelogin').fadeIn();
        });

//  上傳大頭照
        var loadFile = function(event){
                var reader = new FileReader();
                reader.onload = function(){
                        var output = document.getElementById('img_show');
                        output.src = reader.result;
                };
        reader.readAsDataURL(event.target.files[0]);
        };
</script>


@stop