Merge pull request #577 from cuneytsenturk/1.3-dev
App's page add sliders for screenshots.
This commit is contained in:
commit
2f1826f9a7
@ -856,3 +856,49 @@ input[type="number"] {
|
|||||||
.box-filter .select2-container .select2-selection--multiple {
|
.box-filter .select2-container .select2-selection--multiple {
|
||||||
min-height: 30px !important;
|
min-height: 30px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* App Detail Page Sliders Start */
|
||||||
|
.row.module #description .img-fluid.d-block.w-100 {
|
||||||
|
height: 420px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.row.module #description .image-description.text-center {
|
||||||
|
color: white;
|
||||||
|
padding-top: 12px;
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.row.module #description #carousel-screenshot-generic .carousel-control {
|
||||||
|
top: inherit;
|
||||||
|
bottom: inherit;
|
||||||
|
margin-top: 30px;
|
||||||
|
width: 5%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.row.module #description #carousel-screenshot-generic .carousel-control.left {
|
||||||
|
margin-left: -15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.row.module #description #carousel-screenshot-generic .carousel-control .fa {
|
||||||
|
font-size: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.row.module #description .carousel-navigation-message {
|
||||||
|
background-color: #333333;
|
||||||
|
height:40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.row.module #description .carousel-inner .item {
|
||||||
|
padding: 4px 4px 4px 4px;
|
||||||
|
line-height: 1.42857143;
|
||||||
|
background-color: #ffffff;
|
||||||
|
border-top: 1px solid #dddddd;
|
||||||
|
border-left: 1px solid #dddddd;
|
||||||
|
border-right: 1px solid #dddddd;
|
||||||
|
-webkit-transition: all 0.2s ease-in-out;
|
||||||
|
-o-transition: all 0.2s ease-in-out;
|
||||||
|
transition: all 0.2s ease-in-out;
|
||||||
|
}
|
||||||
|
/* App Detail Page Sliders Finish */
|
||||||
|
@ -10,7 +10,7 @@
|
|||||||
@section('content')
|
@section('content')
|
||||||
@include('partials.modules.bar')
|
@include('partials.modules.bar')
|
||||||
|
|
||||||
<div class="row">
|
<div class="row module">
|
||||||
<div class="col-md-12">
|
<div class="col-md-12">
|
||||||
<div class="col-md-8 no-padding-left">
|
<div class="col-md-8 no-padding-left">
|
||||||
<div class="content-header no-padding-left">
|
<div class="content-header no-padding-left">
|
||||||
@ -40,9 +40,59 @@
|
|||||||
@endif
|
@endif
|
||||||
<li><a href="#review" data-toggle="tab" aria-expanded="false">{{ trans('modules.tab.reviews') }} @if ($module->total_review) ({{ $module->total_review }}) @endif</a></li>
|
<li><a href="#review" data-toggle="tab" aria-expanded="false">{{ trans('modules.tab.reviews') }} @if ($module->total_review) ({{ $module->total_review }}) @endif</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<div class="tab-content">
|
<div class="tab-content">
|
||||||
<div class="tab-pane active" id="description">
|
<div class="tab-pane active" id="description">
|
||||||
{!! $module->description !!}
|
{!! $module->description !!}
|
||||||
|
|
||||||
|
@if($module->screenshots)
|
||||||
|
<div id="carousel-screenshot-generic" class="carousel slide" data-ride="carousel">
|
||||||
|
<div class="carousel-inner">
|
||||||
|
@if($module->video)
|
||||||
|
@php
|
||||||
|
if (strpos($module->video->link, '=') !== false) {
|
||||||
|
$code = explode('=', $module->video->link);
|
||||||
|
$code[1]= str_replace('&list', '', $code[1]);
|
||||||
|
|
||||||
|
if (empty($status)) {
|
||||||
|
$status = 5;
|
||||||
|
} else {
|
||||||
|
$status = 1;
|
||||||
|
}
|
||||||
|
@endphp
|
||||||
|
|
||||||
|
<div class="item @if($status == 5) {{ 'active' }} @endif">
|
||||||
|
<iframe width="640" height="385" src="https://www.youtube-nocookie.com/embed/{{ $code[1] }}" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
|
||||||
|
</div>
|
||||||
|
@php } @endphp
|
||||||
|
@endif
|
||||||
|
|
||||||
|
@foreach($module->screenshots as $screenshot)
|
||||||
|
@php if (empty($status)) { $status = 5; } else { $status = 1; } @endphp
|
||||||
|
<div class="item @if($status == 5) {{ 'active' }} @endif">
|
||||||
|
<a data-lightbox="image" href="{{ $screenshot->path_string }}" data-gallery="{{ $screenshot->alt_attribute }}">
|
||||||
|
<img class="img-fluid d-block w-100" src="{{ $screenshot->path_string }}" alt="{{ $screenshot->alt_attribute }}">
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<div class="image-description text-center">
|
||||||
|
{{ $screenshot->description }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
@endforeach
|
||||||
|
|
||||||
|
<div class="carousel-navigation-message">
|
||||||
|
<a class="left carousel-control" href="#carousel-screenshot-generic" role="button" data-slide="prev">
|
||||||
|
<i class="fa fa-chevron-left"></i>
|
||||||
|
<span class="sr-only">{{ trans('pagination.previous') }}</span>
|
||||||
|
</a>
|
||||||
|
<a class="right carousel-control" href="#carousel-screenshot-generic" role="button" data-slide="next">
|
||||||
|
<i class="fa fa-chevron-right"></i>
|
||||||
|
<span class="sr-only">{{ trans('pagination.next') }}</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
@endif
|
||||||
</div>
|
</div>
|
||||||
@if ($module->installation)
|
@if ($module->installation)
|
||||||
<div class="tab-pane" id="installation">
|
<div class="tab-pane" id="installation">
|
||||||
@ -140,30 +190,42 @@
|
|||||||
<div class="box-body">
|
<div class="box-body">
|
||||||
<table class="table table-striped">
|
<table class="table table-striped">
|
||||||
<tbody>
|
<tbody>
|
||||||
|
@if ($module->vendor_name)
|
||||||
<tr>
|
<tr>
|
||||||
<th>{{ trans_choice('general.vendors', 1) }}</th>
|
<th>{{ trans_choice('general.vendors', 1) }}</th>
|
||||||
<td class="text-right"><a href="{{ url('apps/vendors/' . $module->vendor->slug) }}">{{ $module->vendor_name }}</a></td>
|
<td class="text-right"><a href="{{ url('apps/vendors/' . $module->vendor->slug) }}">{{ $module->vendor_name }}</a></td>
|
||||||
</tr>
|
</tr>
|
||||||
|
@endif
|
||||||
|
@if ($module->version)
|
||||||
<tr>
|
<tr>
|
||||||
<th>{{ trans('footer.version') }}</th>
|
<th>{{ trans('footer.version') }}</th>
|
||||||
<td class="text-right">{{ $module->version }}</td>
|
<td class="text-right">{{ $module->version }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
@endif
|
||||||
|
@if ($module->created_at)
|
||||||
<tr>
|
<tr>
|
||||||
<th>{{ trans('modules.added') }}</th>
|
<th>{{ trans('modules.added') }}</th>
|
||||||
<td class="text-right">{{ Date::parse($module->created_at)->format($date_format) }}</td>
|
<td class="text-right">{{ Date::parse($module->created_at)->format($date_format) }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
@endif
|
||||||
|
@if ($module->updated_at)
|
||||||
<tr>
|
<tr>
|
||||||
<th>{{ trans('modules.updated') }}</th>
|
<th>{{ trans('modules.updated') }}</th>
|
||||||
<td class="text-right">{{ Date::parse($module->updated_at)->diffForHumans() }}</td>
|
<td class="text-right">{{ Date::parse($module->updated_at)->diffForHumans() }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
@endif
|
||||||
|
@if ($module->compatibility)
|
||||||
<tr>
|
<tr>
|
||||||
<th>{{ trans('modules.compatibility') }}</th>
|
<th>{{ trans('modules.compatibility') }}</th>
|
||||||
<td class="text-right">{{ $module->compatibility }}</td>
|
<td class="text-right">{{ $module->compatibility }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
@endif
|
||||||
|
@if ($module->category)
|
||||||
<tr>
|
<tr>
|
||||||
<th>{{ trans_choice('general.categories', 1) }}</th>
|
<th>{{ trans_choice('general.categories', 1) }}</th>
|
||||||
<td class="text-right"><a href="{{ url('apps/categories/' . $module->category->slug) }}">{{ $module->category->name }}</a></td>
|
<td class="text-right"><a href="{{ url('apps/categories/' . $module->category->slug) }}">{{ $module->category->name }}</a></td>
|
||||||
</tr>
|
</tr>
|
||||||
|
@endif
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
@ -192,6 +254,11 @@
|
|||||||
var path = '';
|
var path = '';
|
||||||
|
|
||||||
$(document).ready(function() {
|
$(document).ready(function() {
|
||||||
|
$('.carousel').carousel({
|
||||||
|
interval: false,
|
||||||
|
keyboard: true
|
||||||
|
});
|
||||||
|
|
||||||
@if($module->reviews)
|
@if($module->reviews)
|
||||||
getReviews('', '1');
|
getReviews('', '1');
|
||||||
@endif
|
@endif
|
||||||
|
Loading…
x
Reference in New Issue
Block a user