mirror of
https://github.com/Piwigo/Piwigo.git
synced 2025-04-26 19:29:58 +03:00
feature 3077 : use Selectize with AJAX load/cache on cat_perm and batch_manager_unit
git-svn-id: http://piwigo.org/svn/trunk@28496 68402e56-0260-453c-a942-63ccdbb3a9ee
This commit is contained in:
mistic100
parent
703a997f6a
commit
ce8a29810a
4 changed files with 134 additions and 98 deletions
|
|
@ -218,14 +218,6 @@ SELECT
|
|||
;';
|
||||
$tag_selection = get_taglist($query);
|
||||
|
||||
$query = '
|
||||
SELECT
|
||||
id,
|
||||
name
|
||||
FROM '.TAGS_TABLE.'
|
||||
;';
|
||||
$tags = get_taglist($query, false);
|
||||
|
||||
// retrieving direct information about picture
|
||||
$query = '
|
||||
SELECT *
|
||||
|
|
@ -258,7 +250,6 @@ $admin_url_start.= isset($_GET['cat_id']) ? '&cat_id='.$_GET['cat_id'] : '';
|
|||
$template->assign(
|
||||
array(
|
||||
'tag_selection' => $tag_selection,
|
||||
'tags' => $tags,
|
||||
'U_SYNC' => $admin_url_start.'&sync_metadata=1',
|
||||
'U_DELETE' => $admin_url_start.'&delete=1&pwg_token='.get_pwg_token(),
|
||||
|
||||
|
|
|
|||
|
|
@ -2,25 +2,53 @@
|
|||
{include file='include/datepicker.inc.tpl'}
|
||||
{include file='include/colorbox.inc.tpl'}
|
||||
|
||||
{combine_css path='themes/default/js/plugins/jquery.tokeninput.css'}
|
||||
{combine_script id='jquery.tokeninput' load='async' require='jquery' path='themes/default/js/plugins/jquery.tokeninput.js'}
|
||||
{footer_script require='jquery.tokeninput'}
|
||||
jQuery(document).ready(function() {ldelim}
|
||||
jQuery('select[name|="tags"]').tokenInput(
|
||||
[{foreach from=$tags item=tag name=tags}{ldelim}name:"{$tag.name|@escape:'javascript'}",id:"{$tag.id}"{rdelim}{if !$smarty.foreach.tags.last},{/if}{/foreach}],
|
||||
{ldelim}
|
||||
hintText: '{'Type in a search term'|@translate}',
|
||||
noResultsText: '{'No results'|@translate}',
|
||||
searchingText: '{'Searching...'|@translate}',
|
||||
newText: ' ({'new'|@translate})',
|
||||
animateDropdown: false,
|
||||
preventDuplicates: true,
|
||||
allowFreeTagging: true
|
||||
}
|
||||
);
|
||||
{combine_script id='LocalStorageCache' load='footer' path='admin/themes/default/js/LocalStorageCache.js'}
|
||||
|
||||
jQuery("a.preview-box").colorbox();
|
||||
{combine_script id='jquery.selectize' load='footer' path='themes/default/js/plugins/selectize.min.js'}
|
||||
{combine_css id='jquery.selectize' path="themes/default/js/plugins/selectize.default.css"}
|
||||
|
||||
{footer_script}
|
||||
(function(){
|
||||
{* <!-- TAGS --> *}
|
||||
var tagsCache = new LocalStorageCache('tagsAdminList', 5*60, function(callback) {
|
||||
jQuery.getJSON('{$ROOT_URL}ws.php?format=json&method=pwg.tags.getAdminList', function(data) {
|
||||
var tags = data.result.tags;
|
||||
|
||||
for (var i=0, l=tags.length; i<l; i++) {
|
||||
tags[i].id = '~~' + tags[i].id + '~~';
|
||||
}
|
||||
|
||||
callback(tags);
|
||||
});
|
||||
});
|
||||
|
||||
jQuery('[data-selectize=tags]').selectize({
|
||||
valueField: 'id',
|
||||
labelField: 'name',
|
||||
searchField: ['name'],
|
||||
plugins: ['remove_button'],
|
||||
create: function(input, callback) {
|
||||
tagsCache.clear();
|
||||
|
||||
callback({
|
||||
id: input,
|
||||
name: input
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
tagsCache.get(function(tags) {
|
||||
jQuery('[data-selectize=tags]').each(function() {
|
||||
this.selectize.load(function(callback) {
|
||||
callback(tags);
|
||||
});
|
||||
|
||||
jQuery.each(jQuery(this).data('value'), jQuery.proxy(function(i, tag) {
|
||||
this.selectize.addItem(tag.id);
|
||||
}, this));
|
||||
});
|
||||
});
|
||||
}());
|
||||
{/footer_script}
|
||||
|
||||
<h2>{'Batch Manager'|@translate}</h2>
|
||||
|
|
@ -102,13 +130,8 @@ jQuery(document).ready(function() {ldelim}
|
|||
<tr>
|
||||
<td><strong>{'Tags'|@translate}</strong></td>
|
||||
<td>
|
||||
|
||||
<select name="tags-{$element.id}">
|
||||
{foreach from=$element.TAGS item=tag}
|
||||
<option value="{$tag.id}" class="selected">{$tag.name}</option>
|
||||
{/foreach}
|
||||
</select>
|
||||
|
||||
<select data-selectize="tags" data-value="{$element.TAGS|@json_encode|escape:html}"
|
||||
name="tags-{$element.id}[]" multiple style="width:500px;" ></select>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,39 +1,75 @@
|
|||
{combine_script id='jquery.chosen' load='footer' path='themes/default/js/plugins/chosen.jquery.min.js'}
|
||||
{combine_css path="themes/default/js/plugins/chosen.css"}
|
||||
{combine_script id='LocalStorageCache' load='footer' path='admin/themes/default/js/LocalStorageCache.js'}
|
||||
|
||||
{footer_script}{literal}
|
||||
jQuery(document).ready(function() {
|
||||
jQuery(".chzn-select").chosen();
|
||||
{combine_script id='jquery.selectize' load='footer' path='themes/default/js/plugins/selectize.min.js'}
|
||||
{combine_css id='jquery.selectize' path="themes/default/js/plugins/selectize.default.css"}
|
||||
|
||||
function checkStatusOptions() {
|
||||
if (jQuery("input[name=status]:checked").val() == "private") {
|
||||
jQuery("#privateOptions, #applytoSubAction").show();
|
||||
}
|
||||
else {
|
||||
jQuery("#privateOptions, #applytoSubAction").hide();
|
||||
}
|
||||
}
|
||||
|
||||
checkStatusOptions();
|
||||
jQuery("#selectStatus").change(function() {
|
||||
checkStatusOptions();
|
||||
});
|
||||
|
||||
jQuery("#indirectPermissionsDetailsShow").click(function(){
|
||||
jQuery("#indirectPermissionsDetailsShow").hide();
|
||||
jQuery("#indirectPermissionsDetailsHide").show();
|
||||
jQuery("#indirectPermissionsDetails").show();
|
||||
return false;
|
||||
});
|
||||
|
||||
jQuery("#indirectPermissionsDetailsHide").click(function(){
|
||||
jQuery("#indirectPermissionsDetailsShow").show();
|
||||
jQuery("#indirectPermissionsDetailsHide").hide();
|
||||
jQuery("#indirectPermissionsDetails").hide();
|
||||
return false;
|
||||
{footer_script}
|
||||
(function(){
|
||||
{* <!-- GROUPS --> *}
|
||||
var groupsCache = new LocalStorageCache('groupsAdminList', 5*60, function(callback) {
|
||||
jQuery.getJSON('{$ROOT_URL}ws.php?format=json&method=pwg.groups.getList&per_page=99999', function(data) {
|
||||
callback(data.result.groups);
|
||||
});
|
||||
});
|
||||
{/literal}{/footer_script}
|
||||
|
||||
jQuery('[data-selectize=groups]').selectize({
|
||||
valueField: 'id',
|
||||
labelField: 'name',
|
||||
searchField: ['name'],
|
||||
plugins: ['remove_button']
|
||||
});
|
||||
|
||||
groupsCache.get(function(groups) {
|
||||
jQuery('[data-selectize=groups]').each(function() {
|
||||
this.selectize.load(function(callback) {
|
||||
callback(groups);
|
||||
});
|
||||
|
||||
jQuery.each(jQuery(this).data('value'), jQuery.proxy(function(i, id) {
|
||||
this.selectize.addItem(id);
|
||||
}, this));
|
||||
});
|
||||
});
|
||||
|
||||
{* <!-- USERS --> *}
|
||||
var usersCache = new LocalStorageCache('usersAdminList', 5*60, function(callback) {
|
||||
var page = 0,
|
||||
users = [];
|
||||
|
||||
(function load(page){
|
||||
jQuery.getJSON('{$ROOT_URL}ws.php?format=json&method=pwg.users.getList&display=username&per_page=99999&page='+ page, function(data) {
|
||||
users = users.concat(data.result.users);
|
||||
|
||||
if (data.result.paging.count == data.result.paging.per_page) {
|
||||
load(++page);
|
||||
}
|
||||
else {
|
||||
callback(users);
|
||||
}
|
||||
});
|
||||
}(page));
|
||||
});
|
||||
|
||||
jQuery('[data-selectize=users]').selectize({
|
||||
valueField: 'id',
|
||||
labelField: 'username',
|
||||
searchField: ['username'],
|
||||
plugins: ['remove_button']
|
||||
});
|
||||
|
||||
usersCache.get(function(users) {
|
||||
jQuery('[data-selectize=users]').each(function() {
|
||||
this.selectize.load(function(callback) {
|
||||
callback(users);
|
||||
});
|
||||
|
||||
jQuery.each(jQuery(this).data('value'), jQuery.proxy(function(i, id) {
|
||||
this.selectize.addItem(id);
|
||||
}, this));
|
||||
});
|
||||
});
|
||||
}());
|
||||
{/footer_script}
|
||||
|
||||
<div class="titrePage">
|
||||
<h2><span style="letter-spacing:0">{$CATEGORIES_NAV}</span> › {'Edit album'|@translate} {$TABSHEET_TITLE}</h2>
|
||||
|
|
@ -58,9 +94,8 @@ jQuery(document).ready(function() {
|
|||
{if count($groups) > 0}
|
||||
<strong>{'Permission granted for groups'|@translate}</strong>
|
||||
<br>
|
||||
<select data-placeholder="{'Select groups...'|@translate}" class="chzn-select" multiple style="width:700px;" name="groups[]">
|
||||
{html_options options=$groups selected=$groups_selected}
|
||||
</select>
|
||||
<select data-selectize="groups" data-value="{$groups_selected|@json_encode|escape:html}"
|
||||
name="groups[]" multiple style="width:600px;" ></select>
|
||||
{else}
|
||||
{'There is no group in this gallery.'|@translate} <a href="admin.php?page=group_list" class="externalLink">{'Group management'|@translate}</a>
|
||||
{/if}
|
||||
|
|
@ -69,12 +104,11 @@ jQuery(document).ready(function() {
|
|||
<p>
|
||||
<strong>{'Permission granted for users'|@translate}</strong>
|
||||
<br>
|
||||
<select data-placeholder="{'Select users...'|@translate}" class="chzn-select" multiple style="width:700px;" name="users[]">
|
||||
{html_options options=$users selected=$users_selected}
|
||||
</select>
|
||||
<select data-selectize="users" data-value="{$users_selected|@json_encode|escape:html}"
|
||||
name="users[]" multiple style="width:600px;" ></select>
|
||||
</p>
|
||||
|
||||
{if isset($nb_users_granted_indirect)}
|
||||
{if isset($nb_users_granted_indirect) && $nb_users_granted_indirect>0}
|
||||
<p>
|
||||
{'%u users have automatic permission because they belong to a granted group.'|@translate:$nb_users_granted_indirect}
|
||||
<a href="#" id="indirectPermissionsDetailsHide" style="display:none">{'hide details'|@translate}</a>
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
{footer_script}
|
||||
(function(){
|
||||
{* <!-- CATEGORIES --> *}
|
||||
var categoriesCache = new LocalStorageCache('categoriesAdminList', 60, function(callback) {
|
||||
var categoriesCache = new LocalStorageCache('categoriesAdminList', 5*60, function(callback) {
|
||||
jQuery.getJSON('{$ROOT_URL}ws.php?format=json&method=pwg.categories.getAdminList', function(data) {
|
||||
callback(data.result.categories);
|
||||
});
|
||||
|
|
@ -24,25 +24,19 @@ jQuery('[data-selectize=categories]').selectize({
|
|||
});
|
||||
|
||||
categoriesCache.get(function(categories) {
|
||||
var selects = jQuery('[data-selectize=categories]');
|
||||
|
||||
jQuery.each(categories, function(i, category) {
|
||||
selects.each(function() {
|
||||
this.selectize.addOption(category);
|
||||
jQuery('[data-selectize=categories]').each(function() {
|
||||
this.selectize.load(function(callback) {
|
||||
callback(categories);
|
||||
});
|
||||
});
|
||||
|
||||
selects.each(function() {
|
||||
var that = this;
|
||||
|
||||
jQuery.each(jQuery(this).data('value'), function(i, id) {
|
||||
that.selectize.addItem(id);
|
||||
});
|
||||
jQuery.each(jQuery(this).data('value'), jQuery.proxy(function(i, id) {
|
||||
this.selectize.addItem(id);
|
||||
}, this));
|
||||
});
|
||||
});
|
||||
|
||||
{* <!-- TAGS --> *}
|
||||
var tagsCache = new LocalStorageCache('tagsAdminList', 60, function(callback) {
|
||||
var tagsCache = new LocalStorageCache('tagsAdminList', 5*60, function(callback) {
|
||||
jQuery.getJSON('{$ROOT_URL}ws.php?format=json&method=pwg.tags.getAdminList', function(data) {
|
||||
var tags = data.result.tags;
|
||||
|
||||
|
|
@ -70,20 +64,14 @@ jQuery('[data-selectize=tags]').selectize({
|
|||
});
|
||||
|
||||
tagsCache.get(function(tags) {
|
||||
var selects = jQuery('[data-selectize=tags]');
|
||||
|
||||
jQuery.each(tags, function(i, tag) {
|
||||
selects.each(function() {
|
||||
this.selectize.addOption(tag);
|
||||
jQuery('[data-selectize=tags]').each(function() {
|
||||
this.selectize.load(function(callback) {
|
||||
callback(tags);
|
||||
});
|
||||
});
|
||||
|
||||
selects.each(function() {
|
||||
var that = this;
|
||||
|
||||
jQuery.each(jQuery(this).data('value'), function(i, tag) {
|
||||
that.selectize.addItem(tag.id);
|
||||
});
|
||||
jQuery.each(jQuery(this).data('value'), jQuery.proxy(function(i, tag) {
|
||||
this.selectize.addItem(tag.id);
|
||||
}, this));
|
||||
});
|
||||
});
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue