issue #1415 plugin manager redesigned

* actions on plugins are down in AJAX (no more page reload)
* plugins can be filtered but plugins do not move from a section (active) to another (inactive)
This commit is contained in:
Matthieu Leproux
2021-05-20 12:54:15 +02:00
committed by plegall
parent ec4d677cf7
commit a86684ebc4
8 changed files with 799 additions and 136 deletions
+1 -1
View File
@@ -238,7 +238,7 @@ DELETE FROM '. PLUGINS_TABLE .'
{
break;
}
include_once(PHPWG_ROOT_PATH.'admin/include/functions.php');
deltree(PHPWG_PLUGINS_PATH . $plugin_id, PHPWG_PLUGINS_PATH . 'trash');
break;
}
+3 -1
View File
@@ -206,7 +206,9 @@ function cmp($a, $b)
else
return $s[$a['STATE']] >= $s[$b['STATE']];
}
usort($tpl_plugins, 'cmp');
// Stoped plugin sorting for new plugin manager
// usort($tpl_plugins, 'cmp');
$template->assign(
array(
+359 -7
View File
@@ -1,4 +1,7 @@
function setDisplayTile() {
function setDisplayClassic() {
console.log("DISPLAY CLASSIC");
$(".pluginContainer").removeClass("line").removeClass("compact").addClass("classic");
$(".pluginDesc").show();
$(".pluginDescCompact").hide();
$(".pluginActions").show();
@@ -10,6 +13,9 @@ function setDisplayTile() {
}
function setDisplayCompact() {
console.log("DISPLAY COMPACT");
$(".pluginContainer").removeClass("line").addClass("compact").removeClass("classic");
$(".pluginDesc").hide();
$(".pluginDescCompact").show();
$(".pluginActions").hide();
@@ -20,9 +26,20 @@ function setDisplayCompact() {
reduceTitle()
}
function setDisplayLine() {
console.log("DISPLAY LINE");
$(".pluginContainer").addClass("line").removeClass("compact").removeClass("classic");
$(".pluginDesc").show();
$(".pluginDescCompact").hide();
$(".pluginActions").show();
$(".pluginActionsSmallIcons").hide();
normalTitle();
}
function reduceTitle() {
var x = document.getElementsByClassName("pluginMiniBoxNameCell");
var length = 20;
var length = 22;
for (const div of x) {
var text = div.innerHTML.trim()
@@ -44,27 +61,362 @@ function normalTitle() {
}
}
function activatePlugin(id) {
console.log("Plugin activated");
console.log(id);
$("#"+id+" .switch").attr("disabled", true);
$.ajax({
type: 'GET',
dataType: 'json',
url: 'ws.php',
data: { method: 'pwg.plugins.performAction',
action: 'activate',
plugin: id,
pwg_token: pwg_token,
format: 'json' },
success: function (data) {
if (data.stat == 'ok') {
let pluginName = id;
$("#" + id + " .pluginNotif").stop(false, true);
$("#" + id + " .AddPluginSuccess label span:first").html(plugin_added_str.replace("%s", pluginName));
$("#" + id + " .AddPluginSuccess").css("display", "flex");
}
},
error: function () {
console.log(e);
console.log("It didn't work");
$("#" + id + " .pluginNotif").stop(false, true);
$("#" + id + " .PluginActionError label span:first").html(plugin_action_error);
$("#" + id + " .PluginActionError").css("display", "flex");
$("#" + id + " .PluginActionError").delay(1500).fadeOut(2500);
}
}).done(function (data) {
console.log(data);
$("#"+id+" .switch").attr("disabled", false);
$("#" + id + " .AddPluginSuccess").fadeOut(2500);
})
}
function disactivatePlugin(id) {
console.log("Plugin disactivated");
console.log(id);
$("#"+id+" .switch").attr("disabled", true);
$.ajax({
type: 'GET',
dataType: 'json',
url: 'ws.php',
data: { method: 'pwg.plugins.performAction',
action: 'deactivate',
plugin: id,
pwg_token: pwg_token,
format: 'json' },
success: function (data) {
if (data.stat == 'ok') {
let pluginName = id;
$("#" + id + " .pluginNotif").stop(false, true);
$("#" + id + " .DeactivatePluginSuccess label span:first").html(plugin_deactivated_str.replace("%s", pluginName));
$("#" + id + " .DeactivatePluginSuccess").css("display", "flex");
}
},
error: function () {
console.log(e);
console.log("It didn't work");
$("#" + id + " .pluginNotif").stop(false, true);
$("#" + id + " .PluginActionError label span:first").html(plugin_action_error);
$("#" + id + " .PluginActionError").css("display", "flex");
$("#" + id + " .PluginActionError").delay(1500).fadeOut(2500);
}
}).done(function (data) {
console.log(data);
$("#"+id+" .switch").attr("disabled", false);
$("#" + id + " .DeactivatePluginSuccess").fadeOut(2500);
})
}
function deletePlugin(id, name) {
console.log("Plugin deletetion");
console.log(id);
console.log(pwg_token);
$.alert({
title : deleted_plugin_msg.replace("%s",name),
content: function() {
return $.ajax({
type: 'GET',
dataType: 'json',
url: 'ws.php',
data: { method: 'pwg.plugins.performAction',
action: 'delete',
plugin: id,
pwg_token: pwg_token,
format: 'json' },
success: function (data) {
if (data.stat === "ok") {
$("#"+id).remove();
actualizeFilter();
}
},
error: function (e) {
console.log(e);
console.log("It didn't work");
$("#" + id + " .pluginNotif").stop(false, true);
$("#" + id + " .PluginActionError label span:first").html(plugin_action_error);
$("#" + id + " .PluginActionError").css("display", "flex");
$("#" + id + " .PluginActionError").delay(1500).fadeOut(2500);
}
})
},
...jConfirm_alert_options
});
}
function restorePlugin(id) {
console.log("Plugin restoration");
console.log(id);
console.log(pwg_token);
$.ajax({
type: 'GET',
dataType: 'json',
url: 'ws.php',
data: { method: 'pwg.plugins.performAction',
action: 'restore',
plugin: id,
pwg_token: pwg_token,
format: 'json' },
success: function (data) {
if (data.stat == 'ok') {
let pluginName = id;
$("#" + id + " .pluginNotif").stop(false, true);
$("#" + id + " .RestorePluginSuccess label span:first").html(plugin_restored_str.replace("%s", pluginName));
$("#" + id + " .RestorePluginSuccess").css("display", "flex");
}
},
error: function (e) {
console.log(e);
console.log("It didn't work");
$("#" + id + " .pluginNotif").stop(false, true);
$("#" + id + " .PluginActionError label span:first").html(plugin_action_error);
$("#" + id + " .PluginActionError").css("display", "flex");
$("#" + id + " .PluginActionError").delay(1500).fadeOut(2500);
}
}).done(function (data) {
$("#" + id + " .RestorePluginSuccess").fadeOut(2500);
})
}
function uninstallPlugin(id) {
console.log("Plugin uninstallated");
console.log(id);
console.log(pwg_token);
$.ajax({
type: 'GET',
dataType: 'json',
url: 'ws.php',
data: { method: 'pwg.plugins.performAction',
action: 'uninstall',
plugin: id,
pwg_token: pwg_token,
format: 'json' },
success: function (data) {
console.log(data);
console.log("it works (uninstallated)");
},
error: function (e) {
console.log(e);
console.log("It didn't work");
}
})
}
function actualizeFilter() {
$(".filterLabel").hide();
$(".pluginMiniBox").each(function () {
if ($(this).hasClass("plugin-active")) {
$("label[for='seeActive']").show();
console.log("BLEU");
}
if ($(this).hasClass("plugin-inactive")) {
$("label[for='seeInactive']").show();
}
if (($(this).hasClass("plugin-merged")) || ($(this).hasClass("plugin-missing"))) {
$("label[for='seeOther']").show();
}
})
}
$(document).ready(function () {
actualizeFilter();
if (!$.cookie("pwg_plugin_manager_view")) {
$.cookie("pwg_plugin_manager_view", "tile");
}
if ($("#displayTile").is(":checked")) {
setDisplayTile();
if ($("#displayClassic").is(":checked")) {
setDisplayClassic();
};
if ($("#displayCompact").is(":checked")) {
setDisplayCompact();
};
$("#displayTile").change(function () {
setDisplayTile();
$.cookie("pwg_plugin_manager_view", "tile");
if ($("#displayLine").is(":checked")) {
setDisplayLine();
};
$("#displayClassic").change(function () {
setDisplayClassic();
$.cookie("pwg_plugin_manager_view", "classic");
})
$("#displayCompact").change(function () {
setDisplayCompact();
$.cookie("pwg_plugin_manager_view", "compact");
})
$("#displayLine").change(function () {
setDisplayLine();
$.cookie("pwg_plugin_manager_view", "line");
})
/* Plugin Filters */
$("#seeAll").on("change", function () {
console.log("All");
$(".pluginMiniBox").show();
})
$("#seeActive").on("change", function () {
console.log("Active");
$(".pluginMiniBox").show();
$(".pluginMiniBox").each(function () {
if (!$(this).hasClass("plugin-active")) {
$(this).hide();
}
})
})
$("#seeInactive").on("change", function () {
console.log("Inactive");
$(".pluginMiniBox").show();
$(".pluginMiniBox").each(function () {
if (!$(this).hasClass("plugin-inactive")) {
$(this).hide();
}
})
})
$("#seeOther").on("change", function () {
console.log("Other");
$(".pluginMiniBox").show();
$(".pluginMiniBox").each(function () {
if (($(this).hasClass("plugin-active") || $(this).hasClass("plugin-inactive"))) {
$(this).hide();
}
})
})
/* Plugin Actions */
/**
* Activate / Deactivate
*/
$(".switch").change(function () {
if ($(this).find("#toggleSelectionMode").is(':checked')) {
activatePlugin($(this).parent().parent().attr("id"));
console.log("activatePlugin");
$(this).parent().parent().addClass("plugin-active").removeClass("plugin-inactive");
if ($(this).parent().parent().find(".pluginUnavailableAction").attr("href")) {
$(this).parent().parent().find(".pluginUnavailableAction").removeClass("pluginUnavailableAction").addClass("pluginActionLevel1");
}
} else {
disactivatePlugin($(this).parent().parent().attr("id"))
console.log("disactivatePlugin");
$(this).parent().parent().removeClass("plugin-active").addClass("plugin-inactive");
$(this).parent().parent().find(".pluginActionLevel1").removeClass("pluginActionLevel1").addClass("pluginUnavailableAction");
}
actualizeFilter();
})
/**
* Delete
*/
$(".pluginContent").find('.dropdown-option.delete-plugin-button').on('click', function () {
let plugin_name = $(this).closest(".pluginContent").find(".pluginMiniBoxNameCell").html().trim();
let plugin_id = $(this).closest(".pluginContent").parent().attr("id");
console.log($(this).closest(".pluginContent").parent().attr("id"));
$.confirm({
title: delete_plugin_msg.replace("%s",plugin_name),
buttons: {
confirm: {
text: confirm_msg,
btnClass: 'btn-red',
action: function () {
deletePlugin(plugin_id, plugin_name);
},
},
cancel: {
text: cancel_msg
}
},
...jConfirm_confirm_options
})
})
/**
* Restore
*/
$(".pluginContent").find('.dropdown-option.plugin-restore').on('click', function () {
let plugin_name = $(this).closest(".pluginContent").find(".pluginMiniBoxNameCell").html().trim();
let plugin_id = $(this).closest(".pluginContent").parent().attr("id");
console.log($(this).closest(".pluginContent").parent().attr("id"));
$.confirm({
title: restore_plugin_msg.replace('%s', plugin_name),
buttons: {
confirm: {
text: confirm_msg,
btnClass: 'btn-red',
action: function () {
restorePlugin(plugin_id);
},
},
cancel: {
text: cancel_msg
}
},
...jConfirm_confirm_options
})
})
/**
* Uninstall
*/
$(".pluginContent").find('.uninstall-plugin-button').on('click', function () {
let plugin_name = $(this).closest(".pluginContent").find(".pluginMiniBoxNameCell").html().trim();
let plugin_id = $(this).closest(".pluginContent").parent().attr("id");
console.log($(this).closest(".pluginContent").parent().attr("id"));
$.confirm({
title: restore_plugin_msg.replace('%s', plugin_name),
buttons: {
confirm: {
text: confirm_msg,
btnClass: 'btn-red',
action: function () {
uninstallPlugin(plugin_id);
},
},
cancel: {
text: cancel_msg
}
},
...jConfirm_confirm_options
})
})
})
@@ -20,8 +20,13 @@ const are_you_sure_msg = '{'Are you sure?'|@translate|@escape:'javascript'}';
const confirm_msg = '{"Yes, I am sure"|@translate}';
const cancel_msg = "{"No, I have changed my mind"|@translate}";
let delete_plugin_msg = '{'Are you sure you want to delete the plugin "%s"?'|@translate|@escape:'javascript'}';
let deleted_plugin_msg = '{'Plugin "%s" deleted!'|@translate|@escape:'javascript'}';
let restore_plugin_msg = '{'Are you sure you want to restore the plugin "%s"?'|@translate|@escape:'javascript'}';
const restore_tip_msg = "{'Restore default configuration. You will lose your plugin settings!'|@translate}";
const plugin_added_str = '{'Activated!'|@translate}';
const plugin_deactivated_str = '{'Deactivated!'|@translate}';
const plugin_restored_str = '{'Restored!'|@translate}';
const plugin_action_error = '{'an error happened'|@translate}';
{literal}
var queuedManager = jQuery.manageAjax.create('queued', {
queue: true,
@@ -32,30 +37,6 @@ var done = 0;
/* group action */
jQuery(document).ready(function() {
$(".delete-plugin-button").each(function() {
let plugin_name = $(this).closest(".pluginContent").find(".pluginMiniBoxNameCell").html().trim();
$(this).pwg_jconfirm_follow_href({
alert_title: delete_plugin_msg.replace('%s', plugin_name),
alert_confirm: confirm_msg,
alert_cancel: cancel_msg
});
});
$(".plugin-restore").each(function() {
let plugin_name = $(this).closest(".pluginContent").find(".pluginMiniBoxNameCell").html().trim();
$(this).pwg_jconfirm_follow_href({
alert_title: restore_plugin_msg.replace('%s', plugin_name),
alert_confirm: confirm_msg,
alert_cancel: cancel_msg,
alert_content: restore_tip_msg,
});
});
$(".uninstall-plugin-button").each(function() {
$(this).pwg_jconfirm_follow_href({
alert_title: are_you_sure_msg,
alert_confirm: confirm_msg,
alert_cancel: cancel_msg
});
});
jQuery('div.deactivate_all a').click(function() {
$.confirm({
title: deactivate_all_msg,
@@ -160,35 +141,37 @@ jQuery(document).ready(function() {
jQuery(".pluginFilter input").on("input", function() {
let text = jQuery(this).val().toLowerCase();
var searchNumber = 0;
jQuery('.pluginBoxes').each(function () {
let searchNumberInBox = 0;
let pluginBoxes = jQuery(this);
pluginBoxes.find(".pluginMiniBox").each(function() {
$(".pluginMiniBox").each(function() {
if (text == "") {
jQuery(this).fadeIn()
searchNumberInBox++;
jQuery(this).fadeIn();
searchNumber++
} else {
let name = jQuery(this).find(".pluginMiniBoxNameCell").text().toLowerCase();
let description = jQuery(this).find(".pluginDesc").text().toLowerCase();
if (name.search(text) != -1 || description.search(text) != -1){
jQuery(this).fadeIn()
searchNumberInBox++;
searchNumber++;
if ($("#seeAll").is(":checked")) {
jQuery(this).fadeIn();
}
if ($("#seeActive").is(":checked") && jQuery(this).hasClass("plugin-active")) {
jQuery(this).fadeIn();
}
if ($("#seeInactive").is(":checked") && jQuery(this).hasClass("plugin-inactive")) {
jQuery(this).fadeIn();
}
if ($("#seeOther").is(":checked") && (jQuery(this).hasClass("plugin-merged") || jQuery(this).hasClass("plugin-missing"))) {
jQuery(this).fadeIn();
}
} else {
jQuery(this).fadeOut()
jQuery(this).fadeOut();
}
}
})
if (searchNumberInBox == 0) {
pluginBoxes.fadeOut();
} else {
if (pluginBoxes.hasClass("plugin-inactive")) {
showInactivePlugins()
} else {
pluginBoxes.fadeIn();
}
}
searchNumber += searchNumberInBox;
});
if (searchNumber == 0) {
jQuery(".emptyResearch").fadeIn();
} else {
@@ -237,6 +220,10 @@ jQuery(".pluginMiniBox").each(function(index){
{assign var='field_name' value='null'} {* <!-- 'counter' for fieldset management --> *}
{counter start=0 assign=i} {* <!-- counter for 'deactivate all' link --> *}
<div class="pluginTypeFilter">
<input type="radio" name="p-filter" class="filter" id="seeAll" checked><label for="seeAll">All</label><input type="radio" name="p-filter" class="filter" id="seeActive"><label class="filterLabel" for="seeActive">Active</label><input type="radio" name="p-filter" class="filter" id="seeInactive"><label class="filterLabel" for="seeInactive">Inactive</label><input type="radio" name="p-filter" class="filter" id="seeOther"><label class="filterLabel" for="seeOther">Other</label>
</div>
<div class="pluginFilter">
<span class="icon-filter search-icon"></span>
<span class="icon-cancel search-cancel"></span>
@@ -244,46 +231,15 @@ jQuery(".pluginMiniBox").each(function(index){
</div>
<div class="AlbumViewSelector">
<input type="radio" name="layout" class="switchLayout" id="displayTile" {if $smarty.cookies.pwg_plugin_manager_view == 'tile' || !$smarty.cookies.pwg_plugin_manager_view}checked{/if}/><label for="displayTile"><span class="icon-pause firstIcon tiptip" title="{'Tile View'|translate}"></span></label><input type="radio" name="layout" class="switchLayout" id="displayCompact" {if $smarty.cookies.pwg_plugin_manager_view == 'compact'}checked{/if}/><label for="displayCompact"><span class="icon-th-large lastIcon tiptip" title="{'Compact View'|translate}"></span></label>
</div>
<input type="radio" name="layout" class="switchLayout" id="displayClassic" {if $smarty.cookies.pwg_plugin_manager_view == 'classic' || !$smarty.cookies.pwg_plugin_manager_view}checked{/if}/><label for="displayClassic"><span class="icon-pause firstIcon tiptip" title="{'Classic View'|translate}"></span></label><input type="radio" name="layout" class="switchLayout" id="displayLine" {if $smarty.cookies.pwg_plugin_manager_view == 'line'}checked{/if}/><label for="displayLine"><span class="icon-th-list tiptip" title="{'Line View'|translate}"></span></label><input type="radio" name="layout" class="switchLayout" id="displayCompact" {if $smarty.cookies.pwg_plugin_manager_view == 'compact'}checked{/if}/><label for="displayCompact"><span class="icon-th-large lastIcon tiptip" title="{'Compact View'|translate}"></span></label>
</div>
<div class="emptyResearch"> {'No plugins found'|@translate} </div>
<div class="pluginContainer">
{foreach from=$plugins item=plugin name=plugins_loop}
{if $field_name != $plugin.STATE}
{if $field_name != 'null'}
</div> {* PluginBoxes Container*}
</div> {* PluginBoxes*}
{/if}
<div class="pluginBoxes plugin-{$plugin.STATE}" {if $plugin.STATE == 'inactive'}{if $count_types_plugins["inactive"]>$max_inactive_before_hide}style="display:none"{/if}{/if}>
{assign var='field_name' value=$plugin.STATE}
<div class="pluginBoxesHead">
<div class="pluginBoxesTitle">
<p>
{if $plugin.STATE == 'active'}
<span class="icon-purple icon-toggle-on"></span>{'Active Plugins'|@translate}
{elseif $plugin.STATE == 'inactive'}
<span class="icon-red icon-toggle-off"></span>{'Inactive Plugins'|@translate}
{elseif $plugin.STATE == 'missing'}
<span class="icon-green icon-toggle-off"></span>{'Missing Plugins'|@translate}
{elseif $plugin.STATE == 'merged'}
<span class="icon-yellow icon-toggle-off"></span>{'Obsolete Plugins'|@translate}
{/if}
</p>
<div class="pluginBoxesCount">{$count_types_plugins[$plugin.STATE]}</div>
</div>
{if $plugin.STATE == 'active'}
<div class="deactivate_all"><a>{'Deactivate all'|@translate}</a></div>
{/if}
</div>
<div class="pluginBoxesContainer">
{/if}
{if not empty($plugin.AUTHOR)}
{if not empty($plugin.AUTHOR_URL)}
{assign var='author' value="<a href='%s'>%s</a>"|@sprintf:$plugin.AUTHOR_URL:$plugin.AUTHOR}
@@ -297,8 +253,33 @@ jQuery(".pluginMiniBox").each(function(index){
{else}
{assign var='version' value=$plugin.VERSION}
{/if}
<div id="{$plugin.ID}" class="pluginMiniBox {$plugin.STATE}">
<div id="{$plugin.ID}" class="pluginMiniBox {$plugin.STATE} plugin-{$plugin.STATE}">
<div class="AddPluginSuccess pluginNotif">
<label class="icon-ok">
<span>{'Plugin activated'|@translate}</span>
</label>
</div>
<div class="DeactivatePluginSuccess pluginNotif">
<label class="icon-ok">
<span>{'Plugin deactivated'|@translate}</span>
</label>
</div>
<div class="RestorePluginSuccess pluginNotif">
<label class="icon-ok">
<span>{'Plugin deactivated'|@translate}</span>
</label>
</div>
<div class="PluginActionError pluginNotif">
<label class="icon-cancel">
<span>{'Plugin deactivated'|@translate}</span>
</label>
</div>
<div class="pluginContent">
<div class="PluginOptionsIcons">
{if $plugin.STATE == 'active' || $plugin.STATE == 'inactive'}
@@ -306,6 +287,11 @@ jQuery(".pluginMiniBox").each(function(index){
{/if}
</div>
<label class="switch">
<input type="checkbox" id="toggleSelectionMode" {if {$plugin.STATE} === "active"}checked{/if}>
<span class="slider round"></span>
</label>
<div class="pluginActionsSmallIcons">
{if $plugin.STATE == 'active'}
{if $plugin.SETTINGS_URL != ''}
@@ -318,9 +304,15 @@ jQuery(".pluginMiniBox").each(function(index){
</div>
{/if}
{elseif $plugin.STATE == 'inactive'}
<div class="tiptip" title="{'Activate'|@translate}">
<a class="icon-plus-circled" href="{$plugin.U_ACTION}&amp;action=activate" class="activate"></a>
</div>
{if $plugin.SETTINGS_URL != ''}
<div class="tiptip" title="{'Settings'|@translate}">
<a href="{$plugin.SETTINGS_URL}"><span class="icon-cog"></span></a>
</div>
{else}
<div class="tiptip" title="{'Settings'|@translate}">
<a href="{$plugin.SETTINGS_URL}"><span class="icon-cog"></span></a>
</div>
{/if}
{elseif $plugin.STATE == 'missing'}
<div class="tiptip" title="{'Uninstall'|@translate}">
<a class="uninstall-plugin-button" href="{$plugin.U_ACTION}&amp;action=uninstall"></a>
@@ -337,12 +329,8 @@ jQuery(".pluginMiniBox").each(function(index){
<div class="pluginDescCompact">
{$plugin.DESC}
</div>
{if $plugin.STATE == 'active'}
<a class="dropdown-option icon-back-in-time plugin-restore separator-top" href="{$plugin.U_ACTION}&amp;action=restore">{'Restore'|@translate}</a>
<a class="dropdown-option icon-cancel-circled" href="{$plugin.U_ACTION}&amp;action=deactivate">{'Deactivate'|@translate}</a>
{elseif $plugin.STATE == 'inactive'}
<a class="dropdown-option icon-trash delete-plugin-button" href="{$plugin.U_ACTION}&amp;action=delete">{'Delete'|@translate}</a>
{/if}
<a class="dropdown-option icon-back-in-time plugin-restore separator-top">{'Restore'|@translate}</a>
<a class="dropdown-option icon-trash delete-plugin-button separator-top">{'Delete'|@translate}</a>
</div>
<div class="pluginMiniBoxNameCell" data-title="{$plugin.NAME}">
{$plugin.NAME}
@@ -355,10 +343,14 @@ jQuery(".pluginMiniBox").each(function(index){
{if $plugin.SETTINGS_URL != ''}
<a href="{$plugin.SETTINGS_URL}" class="pluginActionLevel1 icon-cog">{'Settings'|@translate}</a>
{else}
<div class="pluginUnavailableAction icon-cog tiptip" title="{'N/A'|translate}">{'Settings'|@translate}</div>
<a class="pluginUnavailableAction icon-cog tiptip" title="{'N/A'|translate}">{'Settings'|@translate}</a>
{/if}
{elseif $plugin.STATE == 'inactive'}
<a class="pluginActionLevel1 icon-plus" href="{$plugin.U_ACTION}&amp;action=activate" class="activate">{'Activate'|@translate}</a>
{if $plugin.SETTINGS_URL != ''}
<a href="{$plugin.SETTINGS_URL}" class="pluginUnavailableAction icon-cog">{'Settings'|@translate}</a>
{else}
<a class="pluginUnavailableAction icon-cog tiptip" title="{'N/A'|translate}">{'Settings'|@translate}</a>
{/if}
{elseif $plugin.STATE == 'missing'}
<a class="pluginActionLevel3 uninstall-plugin-button" href="{$plugin.U_ACTION}&amp;action=uninstall">{'Uninstall'|@translate}</a>
{elseif $plugin.STATE == 'merged'}
@@ -367,22 +359,9 @@ jQuery(".pluginMiniBox").each(function(index){
</div>
</div>
</div> {*<!-- pluginMiniBox -->*}
{/foreach}
</div> {* PluginBoxes Container*}
</div> {* PluginBoxes*}
<div class="showInactivePlugins" {if $count_types_plugins["inactive"]<=$max_inactive_before_hide}style="display:none"{/if} >
<div class="showInactivePluginsInfo">
{assign var='badge_inactive' value='<span class="pluginBoxesCount">%s</span>'|@sprintf:$count_types_plugins["inactive"]}
<div>{'You have %s inactive plugins'|translate:$badge_inactive}</div>
</div>
<button class="buttonLike" id="showInactivePluginsAction">{'Show inactive plugins'|@translate}</button>
</div>
</div>
{/foreach}
</div>
{/if}
@@ -443,7 +422,7 @@ jQuery(".pluginMiniBox").each(function(index){
justify-content: center;
align-items: center;
color: #7f7f7f;
color: #3c3c3c;
}
.pluginActionsSmallIcons a:hover, .PluginOptionsIcons a:hover {
@@ -459,14 +438,34 @@ jQuery(".pluginMiniBox").each(function(index){
display: flex;
}
.pluginActionsSmallIcons a {
transform: scale(1.3);
}
.pluginActionsSmallIcons a span {
.pluginMiniBox.active .pluginActionsSmallIcons a span {
display: flex;
align-items: center;
justify-content: center;
padding: 5px 2px;
background: #ffc17e;
border-radius: 5px;
}
.pluginMiniBox.active .pluginActionsSmallIcons a span:hover {
display: flex;
align-items: center;
justify-content: center;
padding: 5px 2px;
background: #ff7700;
border-radius: 5px;
}
.pluginMiniBox.inactive .pluginActionsSmallIcons a span {
display: flex;
align-items: center;
justify-content: center;
padding: 5px 2px;
background: #e0e0e0;
border-radius: 5px;
}
.pluginActionsSmallIcons a:hover {
@@ -475,6 +474,7 @@ jQuery(".pluginMiniBox").each(function(index){
.pluginMiniBox {
transition: 0.5s;
position: relative;
}
.unavailablePlugin {
@@ -509,4 +509,193 @@ jQuery(".pluginMiniBox").each(function(index){
font-weight: bold;
}
.pluginContainer {
margin-top: 75px;
padding: 0 20px;
}
.switch {
margin: 0 10px 0 0;
}
.plugin-inactive .pluginActions a {
pointer-events: none;
}
.plugin-active .dropdown .delete-plugin-button {
display: none;
}
.plugin-inactive .dropdown .plugin-restore {
display: none;
}
.plugin-inactive .dropdown .delete-plugin-button {
display: block;
}
.plugin-active .dropdown .plugin-restore {
display: block;
}
.plugin-inactive .pluginActionsSmallIcons {
opacity: 0.5;
}
.pluginNotif {
display:none;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: -20px;
font-weight:bold;
z-index: 2;
white-space: nowrap;
}
.AddPluginSuccess span,
.RestorePluginSuccess span,
.DeactivatePluginSuccess span {
color: #0a0;
}
.AddPluginSuccess label,
.DeactivatePluginSuccess label,
.RestorePluginSuccess label {
padding: 10px;
background-color: #c2f5c2;
cursor: default;
color: #0a0;
border-radius: 30px;
}
.PluginActionError span {
color: rgb(170, 0, 0);
}
.PluginActionError label {
padding: 10px;
background-color: #f5c2c2;
cursor: default;
color: rgb(170, 0, 0);
border-radius: 30px;
}
/* Line view */
.pluginContainer.line {
display: flex;
flex-direction: column;
}
.pluginContainer.line .pluginMiniBox {
width: 100%;
height: 50px;
margin: 0 0 10px 0;
}
.pluginContainer.line .pluginMiniBox .pluginContent{
display: flex;
flex-direction: row;
align-items: center;
}
.pluginContainer.line .pluginMiniBox .pluginActions{
width: auto;
margin: 0 25px 0 auto;
}
.pluginContainer.line .pluginMiniBox .PluginOptionsBlock{
display:none;
position:absolute;
right: 30px;
top: 0;
z-index: 2;
transform: translateY(calc(50% - 30px));
}
.pluginContainer.line .pluginMiniBox .dropdown::after {
content: " ";
position: absolute;
bottom: 55%;
left: calc(100% + 5px);
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: transparent transparent #ff7700 transparent;
transform: rotate(90deg);
}
.pluginContainer.line .pluginMiniBox .pluginActions a,
.pluginContainer.classic .pluginMiniBox .pluginActions a{
margin: 0;
padding: 2px 10px;
border-radius: 5px;
color: #3c3c3c;
}
.pluginContainer.line .pluginMiniBox .pluginDesc{
margin: auto 10px auto 10px;
display: block !important;
align-items: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 1000px;
flex: 1;
}
/* Classic view */
.pluginContainer.classic {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.pluginContainer.classic .pluginMiniBoxNameCell {
position: relative;
}
.pluginContainer.classic .switch {
position: absolute;
top: 45px;
}
.pluginContainer.classic .pluginMiniBox .pluginActions {
position: absolute;
top: 47px;
right: 17px;
}
/* Compact view */
.plugin-inactive .pluginActionsSmallIcons a {
pointer-events: none;
}
.pluginContainer.compact {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.pluginContainer.compact .pluginMiniBox {
width: 350px;
margin: 15px 15px 0 0;
}
.pluginContainer.compact .pluginMiniBox .pluginContent {
display: flex;
flex-direction: row;
align-items: center;
}
</style>
+65 -11
View File
@@ -1951,7 +1951,7 @@ h2:lang(en) { text-transform:capitalize; }
.pluginBoxesTitle span {border-radius: 50%; margin-right: 5px; padding: 4px}
.pluginBoxesTitle {display: flex;align-items: center}
.pluginFilter {justify-content: end;position: absolute;right: 130px; z-index: 2; transform: translateY(6px);}
.pluginFilter {justify-content: end;position: absolute;right: 160px; z-index: 2; transform: translateY(6px);}
.pluginBoxesCount {
background-color: rgb(150, 150, 150);
@@ -1980,11 +1980,12 @@ h2:lang(en) { text-transform:capitalize; }
.pluginMiniBox {
display:flex;
width:260px;
margin:15px 30px;
margin:15px;
border-top-right-radius:5px;
border-bottom-right-radius:5px;
margin-left: 0;
box-shadow: 0px 0px 5px #acacac;
/* box-shadow: 0px 0px 5px #acacac; */
box-shadow: 1px 1px 0px 1px #e0e0e0;
}
.PluginOptionsBlock a:hover { color: white ;}
.pluginContent {
@@ -1994,8 +1995,10 @@ h2:lang(en) { text-transform:capitalize; }
padding: 15px;
position: relative;
border-left: solid 5px #ffc17e;
border-right:solid 5px #fafafa;
border-radius: 5px;
border-top-right-radius:5px;
border-bottom-right-radius:5px;
/* border-right:solid 5px #fafafa; */
/* border-radius: 5px; */
}
.pluginMiniBoxNameCell {
@@ -2011,7 +2014,7 @@ h2:lang(en) { text-transform:capitalize; }
}
.pluginDesc {
margin-top: 5px;
margin-top: 43px;
font-size: 12px;
color: grey;
line-height: 1.5em;
@@ -2024,20 +2027,21 @@ h2:lang(en) { text-transform:capitalize; }
margin-top:15px;
font-size:12px;
}
/*
.pluginActions > * {
padding: 10px 4px;
text-align: center;
display:block;
}
} */
.pluginEmptyInput {width: 90px;}
.pluginUnavailableAction {
opacity: 0.5;
font-size: 12px;
padding: 10px 4px;
margin-top: 15px;
background-color:#ddd;
padding: 2px 10px;
/* margin-top: 15px; */
background-color:#dddddddd;
font-weight:700;
border-radius: 5px;
}
.pluginActionLevel1 {background-color: #ffc17e; font-weight: bold;}
.pluginActionLevel1:hover {background-color: #ff7700; color: white; text-decoration: none;}
@@ -2073,6 +2077,56 @@ h2:lang(en) { text-transform:capitalize; }
padding: 13px;
}
.pluginTypeFilter .filter {
display: none;
}
.pluginTypeFilter {
display: flex;
flex-direction: row;
position: absolute;
left: 225px;
z-index: 2;
transform: translateY(13px);
}
.pluginTypeFilter label {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
width: 70px;
height: 30px;
color: #898989;
background: #f3f3f3;
box-shadow: 0px 2px #00000024;
}
.pluginTypeFilter input:checked + label{
background: #ffa500;
color: white;
box-shadow: 0 2px #d18800;
}
.pluginContainer.line .pluginMiniBox:hover .pluginContent{
transition: 0.4s;
background: #ffe5cc;
}
.pluginContainer.line .pluginMiniBox:hover.plugin-inactive .slider {
transition: 0.4s;
background: #999999;
}
.pluginContainer.line .pluginMiniBox:hover .pluginContent .pluginActions a{
/* color: #ffffff; */
opacity: 1;
}
.PluginOptionsBlock{
display:none;
+56
View File
@@ -1104,11 +1104,67 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
background-color:#999999;
}
.pluginContent {
border-left: solid 5px #ff8c27;
}
.pluginUnavailableAction{
background-color:#888;
color:#666;
}
.pluginTypeFilter {
display: flex;
flex-direction: row;
position: absolute;
left: 225px;
z-index: 2;
transform: translateY(13px);
}
.pluginTypeFilter label {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
width: 70px;
height: 30px;
color: #c1c1c1;
background: #555555;
box-shadow: 0px 2px #00000066;
}
.pluginTypeFilter input:checked + label{
background: #ffa500;
color: #444444;
box-shadow: 0 2px #925f00;
}
.pluginContainer.line .pluginMiniBox:hover .pluginContent{
transition: 0.4s;
background: #333333;
}
.pluginContainer.line .pluginMiniBox:hover.plugin-inactive .slider {
transition: 0.4s;
background: #777777;
}
.pluginContainer .pluginMiniBox.plugin-inactive .slider {
transition: 0.4s;
background: #777777;
}
.pluginContainer.line .pluginMiniBox:hover .pluginContent .pluginActions .pluginUnavailableAction{
/* color: #ffffff; */
opacity: 0.5;
}
.addAlbum label{
color:#aaa;
margin:-5px 0;
+6 -1
View File
@@ -1221,4 +1221,9 @@ $lang['%d tags added'] = '%d tags added';
$lang['%d tags deleted'] = '%d tags deleted';
$lang['%d tags edited'] = '%d tags edited';
$lang['%d tags moved'] = '%d tags moved';
$lang['Download all activities'] = 'Download all activities';
$lang['Download all activities'] = 'Download all activities';
$lang['Plugin "%s" has been activated!'] = 'Plugin "%s" has been activated!';
$lang['Plugin "%s" deleted!'] = 'Plugin "%s" deleted!';
$lang['Activated!'] = 'Activated!';
$lang['Deactivated!'] = 'Deactivated!';
$lang['Restored!'] = 'Restored!';
+6 -1
View File
@@ -1223,4 +1223,9 @@ $lang['%d tags added'] = '%d tags ajoutés';
$lang['%d tags deleted'] = '%d tags supprimés';
$lang['%d tags edited'] = '%d tags édités';
$lang['%d tags moved'] = '%d tags déplacés';
$lang['Download all activities'] = 'Télécharger toutes les activités';
$lang['Download all activities'] = 'Télécharger toutes les activités';
$lang['Plugin "%s" has been activated!'] = 'Le plugin "%s" a été activé !';
$lang['Plugin "%s" deleted!'] = 'Plugin "%s" supprimé !';
$lang['Activated!'] = 'Activé!';
$lang['Deactivated!'] = 'Désactivé!';
$lang['Restored!'] = 'Restoré !';