Fixes ekko lightbox style issues and begins implementation of gallery mode for item single page. #27.

This commit is contained in:
mateuswetah 2020-04-07 10:26:10 -03:00
parent d144433ec8
commit 697224800f
5 changed files with 73 additions and 7 deletions

View File

@ -64,6 +64,14 @@ jQuery( document ).ready(function( $ ) {
window.location = $( '.tainacan-list-post .table .tainacan-list-collection' ).data( "href" );
});
$('.single-item-collection--gallery').slick({
slidesToShow: 1,
slidesToScroll: 1,
arrows: false,
fade: true,
asNavFor: '.single-item-collection--attachments'
});
$( '.single-item-collection--attachments' ).slick({
prevArrow: '<button type="button" data-role="none" class="single-item-collection--attachments-prev" aria-label="Previous" role="button" style="display: block;"><i class="tainacan-icon tainacan-icon-arrowleft"></i></button>',
nextArrow: '<button type="button" data-role="none" class="single-item-collection--attachments-next" aria-label="Next" role="button" style="display: block;"><i class="tainacan-icon tainacan-icon-arrowright"></i></button>',

View File

@ -5,12 +5,17 @@
.ekko-lightbox {
.modal-dialog {
width: 100% !important;
margin: 3.75rem auto;
max-width: calc(1400px - 16.667vw) !important;
display: flex !important;
align-items: center;
}
.modal-content {
background: transparent;
border: none;
padding: 16px;
.modal-body {
padding: 0;
@ -26,10 +31,11 @@
display: flex;
justify-content: center;
align-items: center;
position: relative;
& > * {
width: 100%;
max-width: calc(100% - 98px); // Enough to fit arrows aside
max-width: calc(100% - 98px) !important; // Enough to fit arrows aside
height: auto;
max-height: 85vh;
}

View File

@ -269,7 +269,7 @@ function tainacan_customize_register( $wp_customize ) {
$wp_customize->add_setting( 'tainacan_single_item_display_thumbnail', array(
'type' => 'theme_mod',
'capability' => 'edit_theme_options',
'default' => 'true',
'default' => true,
'transport' => 'refresh'
) );
$wp_customize->add_control( 'tainacan_single_item_display_thumbnail', array(
@ -282,7 +282,7 @@ function tainacan_customize_register( $wp_customize ) {
$wp_customize->add_setting( 'tainacan_single_item_display_share_buttons', array(
'type' => 'theme_mod',
'capability' => 'edit_theme_options',
'default' => 'true',
'default' => true,
'transport' => 'refresh'
) );
$wp_customize->add_control( 'tainacan_single_item_display_share_buttons', array(
@ -292,6 +292,23 @@ function tainacan_customize_register( $wp_customize ) {
'label' => __( 'Display share buttons', 'tainacan-interface' ),
'description' => __( 'Toggle to show or not the social icon share buttons, within the metadata list section.', 'tainacan-interface' )
) );
/**
* Adds option to display attachments and document as a gallery list.
*/
$wp_customize->add_setting( 'tainacan_single_item_gallery_mode', array(
'type' => 'theme_mod',
'capability' => 'edit_theme_options',
'default' => false,
'transport' => 'refresh'
) );
$wp_customize->add_control( 'tainacan_single_item_gallery_mode', array(
'type' => 'checkbox',
'priority' => 0, // Within the section.
'section' => 'tainacan_single_item_page',
'label' => __( 'Show Document and Attachments grouped in one slider.', 'tainacan-interface' ),
'description' => __( 'Toggle to show the document and attachments in the same list, a carousel with the current item on top.', 'tainacan-interface' )
) );
}
add_action( 'customize_register', 'tainacan_customize_register', 11 );

File diff suppressed because one or more lines are too long

View File

@ -33,7 +33,7 @@
} ?>
</div>
</header>
<?php if ( tainacan_has_document() ) : ?>
<?php if ( tainacan_has_document() && !get_theme_mod( 'tainacan_single_item_gallery_mode', false )) : ?>
<h1 class="title-content-items"><?php _e( 'Document', 'tainacan-interface' ); ?></h1>
<section class="tainacan-content single-item-collection margin-two-column">
<div class="single-item-collection--document">
@ -82,8 +82,41 @@
<div class="mt-3 tainacan-single-post">
<article role="article">
<h1 class="title-content-items"><?php _e( 'Attachments', 'tainacan-interface' ); ?></h1>
<h1 class="title-content-items">
<?php
if (get_theme_mod( 'tainacan_single_item_gallery_mode', false )) {
_e( 'Document and Attachments', 'tainacan-interface' );
} else {
_e( 'Attachments', 'tainacan-interface' );
}
?>
</h1>
<section class="tainacan-content single-item-collection margin-two-column">
<?php if (get_theme_mod( 'tainacan_single_item_gallery_mode', false )): ?>
<div class="single-item-collection--gallery">
<?php foreach ( $attachments as $attachment ) { ?>
<?php
if ( function_exists('tainacan_get_attachment_html_url') ) {
$href = tainacan_get_attachment_html_url($attachment->ID);
} else {
$href = wp_get_attachment_url($attachment->ID, 'large');
}
?>
<div class="single-item-collection--attachments-file">
<a
class="<?php if (!wp_get_attachment_image( $attachment->ID, 'tainacan-interface-item-attachments')) echo'attachment-without-image'; ?>"
href="<?php echo $href; ?>">
<?php
echo wp_get_attachment_image( $attachment->ID, 'tainacan-interface-item-attachments', true );
echo get_the_title( $attachment->ID );
?>
</a>
</div>
<?php }
?>
</div>
<?php endif; ?>
<div class="single-item-collection--attachments">
<?php foreach ( $attachments as $attachment ) { ?>
<?php
@ -96,7 +129,9 @@
<div class="single-item-collection--attachments-file">
<a
class="<?php if (!wp_get_attachment_image( $attachment->ID, 'tainacan-interface-item-attachments')) echo'attachment-without-image'; ?>"
href="<?php echo $href; ?>" data-toggle="lightbox" data-gallery="example-gallery">
href="<?php echo $href; ?>"
data-toggle="lightbox"
data-gallery="example-gallery">
<?php
echo wp_get_attachment_image( $attachment->ID, 'tainacan-interface-item-attachments', true );
echo get_the_title( $attachment->ID );