first commit
This commit is contained in:
+88
@@ -0,0 +1,88 @@
|
||||
#gallery-metabox-list .attachment-preview {
|
||||
position: relative;
|
||||
padding: 4px;
|
||||
background: #f5f5f5;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#gallery-metabox-list .attachment-preview .thumb {
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
#gallery-metabox-list .remove-image {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 4px;
|
||||
margin: 0;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
overflow: hidden;
|
||||
text-decoration: none;
|
||||
transition: all .3s ease;
|
||||
-webkit-transition: all .3s ease;
|
||||
-moz-transition: all .3s ease;
|
||||
-o-transition: all .3s ease;
|
||||
-ms-transition: all .3s ease;
|
||||
}
|
||||
|
||||
#gallery-metabox-list .remove-image i {
|
||||
background-color: #ffffff;
|
||||
color: #fe5252;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
transition: all .3s ease;
|
||||
-webkit-transition: all .3s ease;
|
||||
-moz-transition: all .3s ease;
|
||||
-o-transition: all .3s ease;
|
||||
-ms-transition: all .3s ease;
|
||||
}
|
||||
|
||||
#gallery-metabox-list .remove-image:hover i {
|
||||
background-color: #fe5252;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
#gallery-metabox-list .attachment-preview:hover .remove-image {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
#gallery-metabox-list:after, #oceanwp-gallery-images-wrap:after {
|
||||
content: ".";
|
||||
display: block;
|
||||
height: 0;
|
||||
clear: both;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
#oceanwp-gallery-images-wrap ul {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
#gallery-metabox-list > li {
|
||||
float: left;
|
||||
cursor: move;
|
||||
margin: 9px 9px 0 0;
|
||||
}
|
||||
|
||||
#gallery-metabox-list li.image img {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
#gallery-metabox-list li.image .change-image {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#gallery-metabox-list .attachment-preview:before {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
/* RTL */
|
||||
body.rtl #gallery-metabox-list > li { float: right; margin: 9px 0 0 9px; }
|
||||
body.rtl #gallery-metabox-list .remove-image { left: 4px; right: auto; }
|
||||
Vendored
+1
@@ -0,0 +1 @@
|
||||
#gallery-metabox-list .attachment-preview{position:relative;padding:4px;background:#f5f5f5;-webkit-box-shadow:none;box-shadow:none}#gallery-metabox-list .attachment-preview .thumb{cursor:move}#gallery-metabox-list .remove-image{position:absolute;top:4px;right:4px;margin:0;opacity:0;visibility:hidden;overflow:hidden;text-decoration:none;transition:all .3s ease;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-o-transition:all .3s ease;-ms-transition:all .3s ease}#gallery-metabox-list .remove-image i{background-color:#fff;color:#fe5252;width:30px;height:30px;line-height:30px;transition:all .3s ease;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-o-transition:all .3s ease;-ms-transition:all .3s ease}#gallery-metabox-list .remove-image:hover i{background-color:#fe5252;color:#fff}#gallery-metabox-list .attachment-preview:hover .remove-image{opacity:1;visibility:visible}#gallery-metabox-list:after,#oceanwp-gallery-images-wrap:after{content:".";display:block;height:0;clear:both;visibility:hidden}#oceanwp-gallery-images-wrap ul{margin:0!important}#gallery-metabox-list>li{float:left;cursor:move;margin:9px 9px 0 0}#gallery-metabox-list li.image img{width:150px;height:150px}#gallery-metabox-list li.image .change-image{width:100%;text-align:center;-webkit-box-shadow:none;box-shadow:none}#gallery-metabox-list .attachment-preview:before{display:none!important}body.rtl #gallery-metabox-list>li{float:right;margin:9px 0 0 9px}body.rtl #gallery-metabox-list .remove-image{left:4px;right:auto}
|
||||
@@ -0,0 +1,297 @@
|
||||
<?php
|
||||
/**
|
||||
* Creates a gallery metabox for WordPress
|
||||
*
|
||||
* @author Daan Vos de Wael
|
||||
* @copyright Copyright (c) 2013, Daan Vos de Wael, http://www.daanvosdewael.com
|
||||
* @license http://en.wikipedia.org/wiki/MIT_License The MIT License
|
||||
*/
|
||||
|
||||
// Exit if accessed directly
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit;
|
||||
}
|
||||
|
||||
// Start Class
|
||||
if ( ! class_exists( 'OceanWP_Gallery_Metabox' ) ) {
|
||||
class OceanWP_Gallery_Metabox {
|
||||
private $dir;
|
||||
private $post_types;
|
||||
|
||||
/**
|
||||
* Initialize the class and set its properties.
|
||||
*
|
||||
* @since 1.0.0
|
||||
*/
|
||||
public function __construct() {
|
||||
|
||||
// Call the register function
|
||||
add_action( 'load-post.php', array( $this, 'register' ), 95 );
|
||||
add_action( 'load-post-new.php', array( $this, 'register' ), 95 );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Registration callback
|
||||
*
|
||||
* @since 1.1.1
|
||||
*/
|
||||
public function register() {
|
||||
|
||||
// Post types to add the metabox to
|
||||
$this->post_types = apply_filters( 'ocean_gallery_metabox_post_types', array(
|
||||
'post',
|
||||
) );
|
||||
|
||||
// Add metabox to corresponding post types
|
||||
foreach( $this->post_types as $key => $val ) {
|
||||
add_action( 'add_meta_boxes_'. $val, array( $this, 'add_meta' ), 20 );
|
||||
}
|
||||
|
||||
// Save metabox
|
||||
add_action( 'save_post', array( $this, 'save_meta' ) );
|
||||
|
||||
// Load scripts and styles.
|
||||
add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_scripts' ) );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Adds the gallery metabox
|
||||
*
|
||||
* @since 1.0.0
|
||||
*/
|
||||
public function add_meta( $post ) {
|
||||
add_meta_box(
|
||||
'oceanwp-gallery-metabox',
|
||||
__( 'Image Gallery', 'ocean-extra' ),
|
||||
array( $this, 'render' ),
|
||||
$post->post_type,
|
||||
'normal',
|
||||
'high'
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Load scripts and styles
|
||||
*
|
||||
* @since 1.1.1
|
||||
*/
|
||||
public function enqueue_scripts( $hook ) {
|
||||
|
||||
// Only needed on these admin screens
|
||||
if ( $hook != 'edit.php' && $hook != 'post.php' && $hook != 'post-new.php' ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Get global post
|
||||
global $post;
|
||||
|
||||
// Return if post is not object
|
||||
if ( ! is_object( $post ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Return if wrong post type
|
||||
if ( ! in_array( $post->post_type, $this->post_types ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Enqueue the main script.
|
||||
wp_enqueue_script( 'oceanwp-gallery-js', plugins_url( '/js/gallery-metabox.min.js', __FILE__ ), array( 'jquery' ), '', true );
|
||||
|
||||
// Enqueue the main style.
|
||||
wp_enqueue_style( 'oceanwp-gallery-css', plugins_url( '/css/gallery-metabox.min.css', __FILE__ ) );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Render the gallery metabox
|
||||
*
|
||||
* @since 1.0.0
|
||||
*/
|
||||
public function render() {
|
||||
global $post; ?>
|
||||
|
||||
|
||||
<p class="add-oceanwp-gallery-images hide-if-no-js">
|
||||
<a class="gallery-add button-primary" href="#"><?php esc_html_e( 'Add Image(s)', 'ocean-extra' ); ?></a>
|
||||
</p>
|
||||
|
||||
<div class="oceanwp-gallery-images-wrap">
|
||||
|
||||
<ul id="gallery-metabox-list">
|
||||
|
||||
<?php
|
||||
wp_nonce_field( 'gallery_meta_nonce', 'gallery_meta_nonce' );
|
||||
$ids = get_post_meta( $post->ID, 'ocean_gallery_id', true );
|
||||
|
||||
if ( $ids ) : foreach ( $ids as $key => $value ) : $image = wp_get_attachment_image_src( $value ); ?>
|
||||
|
||||
<li class="image">
|
||||
<div class="attachment-preview">
|
||||
<input type="hidden" name="ocean_gallery_id[<?php echo $key; ?>]" value="<?php echo $value; ?>">
|
||||
<div class="thumb"><img class="image-preview" src="<?php echo $image[0]; ?>"></div>
|
||||
<a class="change-image button" href="#"><?php esc_html_e( 'Change image', 'ocean-extra' ); ?></a>
|
||||
<a class="remove-image" href="#" title="<?php esc_html_e( 'Remove image', 'ocean-extra' ); ?>"><i class="dashicons dashicons-no-alt"></i></a>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<?php endforeach; endif; ?>
|
||||
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
<?php $checked = checked( get_post_meta( get_the_ID(), 'ocean_gallery_link_images', true ), 'on', false ); ?>
|
||||
|
||||
<p>
|
||||
<label for="ocean_gallery_link_images">
|
||||
<input type="checkbox" id="ocean_gallery_link_images" value="on" name="ocean_gallery_link_images"<?php echo $checked; ?> /> <?php esc_html_e( 'Enable lightbox for this gallery?', 'ocean-extra' )?>
|
||||
</label>
|
||||
</p>
|
||||
|
||||
<?php
|
||||
}
|
||||
|
||||
/**
|
||||
* Save the gallery metabox
|
||||
*
|
||||
* @since 1.0.0
|
||||
*/
|
||||
public static function save_meta( $post_id ) {
|
||||
|
||||
// Check nonce
|
||||
if ( ! isset( $_POST['gallery_meta_nonce'] )
|
||||
|| ! wp_verify_nonce( $_POST[ 'gallery_meta_nonce' ], 'gallery_meta_nonce' ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Check auto save
|
||||
if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Check user permissions
|
||||
if ( ! current_user_can( 'edit_post', $post_id ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
if ( isset( $_POST[ 'ocean_gallery_id' ] ) ) {
|
||||
update_post_meta( $post_id, 'ocean_gallery_id', $_POST[ 'ocean_gallery_id' ] );
|
||||
} else {
|
||||
delete_post_meta ( $post_id, 'ocean_gallery_id' );
|
||||
}
|
||||
|
||||
// link to larger images
|
||||
if ( isset( $_POST[ 'ocean_gallery_link_images' ] ) ) {
|
||||
update_post_meta( $post_id, 'ocean_gallery_link_images', $_POST[ 'ocean_gallery_link_images' ] );
|
||||
} else {
|
||||
update_post_meta( $post_id, 'ocean_gallery_link_images', 'off' );
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
// Class needed only in the admin
|
||||
if ( is_admin() ) {
|
||||
$oceanwp_gallery_metabox = new OceanWP_Gallery_Metabox;
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if the post has a gallery
|
||||
*
|
||||
* @since 1.0.0
|
||||
*/
|
||||
if ( ! function_exists( 'oceanwp_post_has_gallery' ) ) {
|
||||
|
||||
function oceanwp_post_has_gallery( $post_id = '' ) {
|
||||
|
||||
$post_id = $post_id ? $post_id : get_the_ID();
|
||||
|
||||
if ( get_post_meta( $post_id, 'ocean_gallery_id', true ) ) {
|
||||
return true;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieve attachment IDs
|
||||
*
|
||||
* @since 1.0.0
|
||||
*/
|
||||
if ( ! function_exists( 'oceanwp_get_gallery_ids' ) ) {
|
||||
|
||||
function oceanwp_get_gallery_ids( $post_id = '' ) {
|
||||
|
||||
$post_id = $post_id ? $post_id : get_the_ID();
|
||||
$attachment_ids = get_post_meta( $post_id, 'ocean_gallery_id', true );
|
||||
|
||||
if ( $attachment_ids ) {
|
||||
return $attachment_ids;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieve attachment data
|
||||
*
|
||||
* @since 1.0.0
|
||||
*/
|
||||
if ( ! function_exists( 'oceanwp_get_attachment' ) ) {
|
||||
|
||||
function oceanwp_get_attachment( $id ) {
|
||||
|
||||
$attachment = get_post( $id );
|
||||
|
||||
return array(
|
||||
'alt' => get_post_meta( $attachment->ID, '_wp_attachment_image_alt', true ),
|
||||
'caption' => $attachment->post_excerpt,
|
||||
'description' => $attachment->post_content,
|
||||
'href' => get_permalink( $attachment->ID ),
|
||||
'src' => $attachment->guid,
|
||||
'title' => $attachment->post_title,
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Return gallery count
|
||||
*
|
||||
* @since 1.0.0
|
||||
*/
|
||||
if ( ! function_exists( 'oceanwp_gallery_count' ) ) {
|
||||
|
||||
function oceanwp_gallery_count() {
|
||||
|
||||
$ids = oceanwp_get_gallery_ids();
|
||||
return count( $ids );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if lightbox is enabled
|
||||
*
|
||||
* @since 1.0.0
|
||||
*/
|
||||
if ( ! function_exists( 'oceanwp_gallery_is_lightbox_enabled' ) ) {
|
||||
|
||||
function oceanwp_gallery_is_lightbox_enabled() {
|
||||
|
||||
if ( 'on' == get_post_meta( get_the_ID(), 'ocean_gallery_link_images', true ) ) {
|
||||
return true;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
@@ -0,0 +1,90 @@
|
||||
jQuery(function($) {
|
||||
|
||||
var file_frame;
|
||||
|
||||
$(document).on('click', '#oceanwp-gallery-metabox a.gallery-add', function(e) {
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
if (file_frame) file_frame.close();
|
||||
|
||||
file_frame = wp.media.frames.file_frame = wp.media({
|
||||
title: $(this).data('uploader-title'),
|
||||
button: {
|
||||
text: $(this).data('uploader-button-text'),
|
||||
},
|
||||
multiple: true
|
||||
});
|
||||
|
||||
file_frame.on('select', function() {
|
||||
var listIndex = $('#gallery-metabox-list li').index($('#gallery-metabox-list li:last')),
|
||||
selection = file_frame.state().get('selection');
|
||||
|
||||
selection.map(function(attachment, i) {
|
||||
attachment = attachment.toJSON(),
|
||||
index = listIndex + (i + 1);
|
||||
|
||||
$('#gallery-metabox-list').append('<li class="image"><div class="attachment-preview"><input type="hidden" name="ocean_gallery_id[' + index + ']" value="' + attachment.id + '"><div class="thumb"><img class="image-preview" src="' + attachment.sizes.thumbnail.url + '"></div><a class="change-image button" href="#">Change image</a><a class="remove-image" href="#" title="Remove image"><i class="dashicons dashicons-no-alt"></i></a></div></li>');
|
||||
});
|
||||
});
|
||||
|
||||
makeSortable();
|
||||
|
||||
file_frame.open();
|
||||
|
||||
});
|
||||
|
||||
$(document).on('click', '#oceanwp-gallery-metabox a.change-image', function(e) {
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
var that = $(this);
|
||||
|
||||
if (file_frame) file_frame.close();
|
||||
|
||||
file_frame = wp.media.frames.file_frame = wp.media({
|
||||
title: $(this).data('uploader-title'),
|
||||
button: {
|
||||
text: $(this).data('uploader-button-text'),
|
||||
},
|
||||
multiple: false
|
||||
});
|
||||
|
||||
file_frame.on( 'select', function() {
|
||||
attachment = file_frame.state().get('selection').first().toJSON();
|
||||
|
||||
that.parent().find('input:hidden').attr('value', attachment.id);
|
||||
that.parent().find('img.image-preview').attr('src', attachment.sizes.thumbnail.url);
|
||||
});
|
||||
|
||||
file_frame.open();
|
||||
|
||||
});
|
||||
|
||||
function resetIndex() {
|
||||
$('#gallery-metabox-list li').each(function(i) {
|
||||
$(this).find('input:hidden').attr('name', 'ocean_gallery_id[' + i + ']');
|
||||
});
|
||||
}
|
||||
|
||||
function makeSortable() {
|
||||
$('#gallery-metabox-list').sortable({
|
||||
opacity: 0.6,
|
||||
stop: function() {
|
||||
resetIndex();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$(document).on('click', '#oceanwp-gallery-metabox a.remove-image', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
$(this).parents('li').animate({ opacity: 0 }, 200, function() {
|
||||
$(this).remove();
|
||||
resetIndex();
|
||||
});
|
||||
});
|
||||
|
||||
makeSortable();
|
||||
|
||||
});
|
||||
+1
@@ -0,0 +1 @@
|
||||
jQuery(function(a){function c(){a("#gallery-metabox-list li").each(function(b){a(this).find("input:hidden").attr("name","ocean_gallery_id["+b+"]")})}function d(){a("#gallery-metabox-list").sortable({opacity:.6,stop:function(){c()}})}var b;a(document).on("click","#oceanwp-gallery-metabox a.gallery-add",function(c){c.preventDefault(),b&&b.close(),b=wp.media.frames.file_frame=wp.media({title:a(this).data("uploader-title"),button:{text:a(this).data("uploader-button-text")},multiple:!0}),b.on("select",function(){var c=a("#gallery-metabox-list li").index(a("#gallery-metabox-list li:last")),d=b.state().get("selection");d.map(function(b,d){b=b.toJSON(),index=c+(d+1),a("#gallery-metabox-list").append('<li class="image"><div class="attachment-preview"><input type="hidden" name="ocean_gallery_id['+index+']" value="'+b.id+'"><div class="thumb"><img class="image-preview" src="'+b.sizes.thumbnail.url+'"></div><a class="change-image button" href="#">Change image</a><a class="remove-image" href="#" title="Remove image"><i class="dashicons dashicons-no-alt"></i></a></div></li>')})}),d(),b.open()}),a(document).on("click","#oceanwp-gallery-metabox a.change-image",function(c){c.preventDefault();var d=a(this);b&&b.close(),b=wp.media.frames.file_frame=wp.media({title:a(this).data("uploader-title"),button:{text:a(this).data("uploader-button-text")},multiple:!1}),b.on("select",function(){attachment=b.state().get("selection").first().toJSON(),d.parent().find("input:hidden").attr("value",attachment.id),d.parent().find("img.image-preview").attr("src",attachment.sizes.thumbnail.url)}),b.open()}),a(document).on("click","#oceanwp-gallery-metabox a.remove-image",function(b){b.preventDefault(),a(this).parents("li").animate({opacity:0},200,function(){a(this).remove(),c()})}),d()});
|
||||
Reference in New Issue
Block a user