blue-twilight/resources/views/themes/base/gallery/user_profile.blade.php

162 lines
8.0 KiB
PHP

@extends(Theme::viewName('layout'))
@section('title', $user->name)
@section('breadcrumb')
<li class="breadcrumb-item"><a href="{{ route('home') }}"><i class="fa fa-fw fa-home"></i></a></li>
<li class="breadcrumb-item active">{{ $user->name }}</li>
@endsection
@section('content')
<div class="container" id="user-app">
<div class="row">
<div id="user-avatar" class="col-sm-4 col-md-3 col-xl-2 mb-3">
<img class="rounded" src="{{ Theme::gravatarUrl($user->email, 160) }}" title="{{ $user->name }}" />
</div>
<div class="col-sm-8 col-md-9 col-xl-10">
@if ($can_follow)
@if ($is_following)
<a class="pull-right btn btn-lg btn-outline-primary" href="#" v-on:click="unFollowUser"><i class="fa fa-check fa-fw"></i> @lang('gallery.user_profile.following_button')</a>
@else
<a class="pull-right btn btn-lg btn-primary" href="#" v-on:click="followUser">@lang('gallery.user_profile.follow_button')</a>
@endif
@endif
<h1>{{ $user->name }}</h1>
@if (!empty($user->profile_alias))
<h2 class="text-muted">{{ $user->profile_alias }}</h2>
@endif
</div>
</div>
<div class="row mt-3">
<div class="col">
<ul class="nav nav-pills">
<li class="nav-item">
<a class="nav-link" href="{{ url()->current() }}" v-bind:class="{ active: isProfile }" v-on:click="switchToProfile"><i class="fa fa-fw fa-info-circle"></i> @lang('gallery.user_profile.profile_tab')</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{{ url()->current() }}" v-bind:class="{ active: isFeed }" v-on:click="switchToFeed"><i class="fa fa-fw fa-clock-o"></i> @lang('gallery.user_profile.feed_tab')</a>
</li>
</ul>
</div>
</div>
<div class="row mt-5" v-if="selected_view === 'profile'">
<div class="col">
@if (count($albums) == 0)
<h4 class="text-danger"><b>@lang('gallery.user_profile.no_albums_p1')</b></h4>
<p>@lang('gallery.user_profile.no_albums_p2', ['user_name' => $user->name])</p>
@else
<h3 class="mb-4 text-muted">@lang('gallery.user_profile.albums', ['user_name' => $user->name])</h3>
<div class="row">
@foreach ($albums as $childAlbum)
@include(Theme::viewName('partials.gallery_child_album'), ['show_text' => true])
@endforeach
</div>
@endif
<h3 class="mt-5 mb-4 text-muted">@lang('gallery.user_profile.activity')</h3>
<div>
{{-- Nav tabs --}}
<ul class="nav nav-tabs" role="tablist">
@include(Theme::viewName('partials.tab'), ['active_tab' => 'activity-taken', 'tab_name' => 'activity-taken', 'tab_icon' => 'camera', 'tab_text' => trans('gallery.user_profile.activity_taken_tab')])
@include(Theme::viewName('partials.tab'), ['active_tab' => 'activity-taken', 'tab_name' => 'activity-uploaded', 'tab_icon' => 'upload', 'tab_text' => trans('gallery.user_profile.activity_uploaded_tab')])
</ul>
{{-- Tab panes --}}
<div class="tab-content">
{{-- Photos taken --}}
<div role="tabpanel" class="tab-pane active" id="activity-taken-tab">
<p>@lang('gallery.user_profile.activity_taken_p1', ['user_name' => $user->name])</p>
@include (Theme::viewName('partials.user_profile_activity_grid'), ['activity' => $activity_taken])
</div>
{{-- Photos uploaded --}}
<div role="tabpanel" class="tab-pane" id="activity-uploaded-tab">
<p>@lang('gallery.user_profile.activity_uploaded_p1', ['user_name' => $user->name])</p>
@include (Theme::viewName('partials.user_profile_activity_grid'), ['activity' => $activity_uploaded])
</div>
</div>
</div>
@if (count($cameras) > 0)
<h3 class="mb-4 mt-5 text-muted">@lang('gallery.user_profile.cameras')</h3>
<div class="table-responsive">
<table class="table table-striped">
<thead>
<tr>
<th>@lang('admin.album_camera_make')</th>
<th>@lang('admin.album_camera_model')</th>
<th>@lang('admin.album_camera_software')</th>
<th>@lang('admin.album_camera_photo_count')</th>
</tr>
</thead>
<tbody>
@foreach ($cameras as $camera)
<tr>
<td>{{ $camera->camera_make }}</td>
<td>{{ $camera->camera_model }}</td>
<td>{{ $camera->camera_software }}</td>
<td>{{ $camera->photo_count }}</td>
</tr>
@endforeach
</tbody>
</table>
</div>
@endif
</div>
</div>
<div class="row mt-5" v-if="selected_view === 'feed'">
<div class="col">
<div v-if="is_loading">
<p class="text-center mb-1">
<img src="{{ asset('ripple.svg') }}" alt="@lang('global.please_wait')" title="@lang('global.please_wait')"/>
</p>
<p class="text-center">
@lang('global.please_wait')
</p>
</div>
<div v-if="feed_items.length > 0">
<div class="card mb-2" v-for="feed_item in feed_items">
<div class="card-body row">
<div class="col-2 col-md-1 pr-0" style="max-width: 47px;">
<img class="rounded-circle" v-bind:src="feed_item.avatar"/>
</div>
<div class="col-10 col-md-11">
<span v-html="feed_item.description"></span><br/>
<span class="text-muted" style="font-size: smaller;" v-html="feed_item.activity_at"></span>
</div>
</div>
</div>
</div>
<div class="text-center" v-if="!is_loading && feed_items.length == 0">
<h4 class="text-danger"><b>@lang('gallery.user_profile.no_feed_activity_p1')</b></h4>
<p>@lang('gallery.user_profile.no_feed_activity_p2', ['user_name' => $user->name])</p>
</div>
</div>
</div>
</div>
@endsection
@push('scripts')
<script type="text/javascript">
var viewModel = new UserViewModel({
current_url: '{{ url()->current() }}',
feed_url: '{{ $user->feedJsonUrl() }}',
follow_user_url: '{{ $user->followUrl() }}',
unfollow_user_url: '{{ $user->unFollowUrl() }}'
});
var app = new Vue(viewModel);
app.user_id = '{{ $user->id }}';
app.loadFeedItems();
@if ($active_tab == 'feed')
app.selected_view = 'feed';
@elseif ($active_tab == 'profile')
app.selected_view = 'profile';
@endif
</script>
@endpush