111 lines
4.3 KiB
JavaScript
111 lines
4.3 KiB
JavaScript
/**
|
|
* Goodlayers Image Picker File
|
|
* ---------------------------------------------------------------------
|
|
* @version 1.0
|
|
* @author Goodlayers
|
|
* @link http://goodlayers.com
|
|
* @copyright Copyright (c) Goodlayers
|
|
* ---------------------------------------------------------------------
|
|
* This file contains the jQuery script for slider image chooser
|
|
* ---------------------------------------------------------------------
|
|
*/
|
|
|
|
jQuery(document).ready(function(){
|
|
|
|
// Decide to show select-image-none element for each image chooser
|
|
jQuery('.image-picker').each(function(){
|
|
if(jQuery(this).find('#selected-image ul').children().size() > 1 ){
|
|
jQuery(this).find('#selected-image-none').css('display','none');
|
|
}
|
|
});
|
|
|
|
// Bind the edit and delete image button
|
|
jQuery('.edit-image').click(function(){
|
|
jQuery(this).parents('li').find('#slider-detail-wrapper').fadeIn();
|
|
});
|
|
jQuery('.gdl-button#gdl-detail-edit-done').click(function(){
|
|
jQuery(this).parents('#slider-detail-wrapper').fadeOut();
|
|
});
|
|
jQuery('.unpick-image').click(function(){
|
|
jQuery(this).bindImagePickerUnpick();
|
|
});
|
|
jQuery.fn.bindImagePickerUnpick = function(){
|
|
var deleted_image = jQuery(this);
|
|
|
|
jQuery.confirm({
|
|
'message' : 'Are you sure to do this?',
|
|
'buttons' : {
|
|
'Delete' : {
|
|
'class' : 'confirm-yes',
|
|
'action': function(){
|
|
deleted_image.parents('li').slideUp('200',function(){
|
|
jQuery(this).remove();
|
|
});
|
|
if ( deleted_image.parents('#image-picker').find('#selected-image ul').children().size() == 2 ){
|
|
deleted_image.parents('#image-picker').find('#selected-image-none').slideDown();
|
|
}
|
|
deleted_image.parents('#image-picker').find('input#slider-num').attr('value',function(){
|
|
return parseInt(jQuery(this).attr('value')) - 1;
|
|
});
|
|
}
|
|
},
|
|
'Cancel' : {
|
|
'class' : 'confirm-no',
|
|
'action': function(){ return false; }
|
|
}
|
|
}
|
|
});
|
|
};
|
|
|
|
// Bind the navigation bar and call server using ajax to get the media for each page
|
|
jQuery('div.selected-image ul').sortable({ tolerance: 'pointer', forcePlaceholderSize: true, placeholder: 'slider-placeholder', cancel: '.slider-detail-wrapper' });
|
|
jQuery('.media-gallery-nav ul a li').click(function(){
|
|
jQuery(this).bindImagePickerClickPage();
|
|
});
|
|
jQuery.fn.bindImagePickerClickPage = function(){
|
|
var image_picker = jQuery(this).parents('#image-picker');
|
|
var current_gallery = image_picker.find('#media-image-gallery');
|
|
var paged = jQuery(this).attr('rel');
|
|
current_gallery.slideUp('200');
|
|
image_picker.find('#show-media-text').html('Loading');
|
|
image_picker.find('#show-media-image').addClass('loading-media-image');
|
|
jQuery.post(ajaxurl,{ action:'get_media_image', page: paged },function(data){
|
|
paged='';
|
|
current_gallery.html(data);
|
|
current_gallery.find('ul li img').bind('click',function(){
|
|
jQuery(this).bindImagePickerChooseItem();
|
|
});
|
|
current_gallery.find('#media-gallery-nav ul a li').bind('click',function(){
|
|
jQuery(this).bindImagePickerClickPage();
|
|
});
|
|
current_gallery.slideDown('200');
|
|
image_picker.find('#show-media-text').html('');
|
|
image_picker.find('#show-media-image').removeClass();
|
|
});
|
|
}
|
|
|
|
// Bind the image when user choose item
|
|
jQuery('.image-picker').find('#media-image-gallery').find('ul li img').click(function(){
|
|
jQuery(this).bindImagePickerChooseItem();
|
|
});
|
|
jQuery.fn.bindImagePickerChooseItem = function(){
|
|
var clone = jQuery(this).parents('#image-picker').find('#default').clone(true);
|
|
clone.find('input, textarea, select').attr('name',function(){
|
|
return jQuery(this).attr('id') + '[]';
|
|
});
|
|
clone.attr('id','slider-image-init');
|
|
clone.attr('class','slider-image-init');
|
|
clone.css('display','none');
|
|
clone.find('.slider-image-url').attr('value', jQuery(this).attr('attid'));
|
|
clone.find('img').attr('src',jQuery(this).attr('rel'));
|
|
clone.find('img').attr('rel', jQuery(this).attr('rel'));
|
|
jQuery(this).parents('#image-picker').find('#selected-image-none').slideUp();
|
|
jQuery(this).parents('#image-picker').find('#selected-image ul').append(clone);
|
|
jQuery(this).parents('#image-picker').find('#selected-image ul li').not('#default').slideDown('200');
|
|
jQuery(this).parents('#image-picker').find('input#slider-num').attr('value',function(){
|
|
return parseInt(jQuery(this).attr('value')) + 1;
|
|
});
|
|
}
|
|
|
|
});
|