mirror of
https://github.com/Piwigo/Piwigo.git
synced 2026-08-07 09:13:02 +02:00
#1467 Plugin Update refresh
- Style the update plugin and update extension page to match with pluginBoxes design - Move the css of plugin installed from .tpl to .css - Change class name of pluginBox forms (classic, line and compact in classic-form, line-form...) - Factorize the code of the update extension page
This commit is contained in:
Zacharie Guet
@@ -1,5 +1,5 @@
|
||||
function setDisplayClassic() {
|
||||
$(".pluginContainer").removeClass("line").removeClass("compact").addClass("classic");
|
||||
$(".pluginContainer").removeClass("line-form").removeClass("compact-form").addClass("classic-form");
|
||||
|
||||
$(".pluginDesc").show();
|
||||
$(".pluginDescCompact").hide();
|
||||
@@ -12,7 +12,7 @@ function setDisplayClassic() {
|
||||
}
|
||||
|
||||
function setDisplayCompact() {
|
||||
$(".pluginContainer").removeClass("line").addClass("compact").removeClass("classic");
|
||||
$(".pluginContainer").removeClass("line-form").addClass("compact-form").removeClass("classic-form");
|
||||
|
||||
$(".pluginDesc").hide();
|
||||
$(".pluginDescCompact").show();
|
||||
@@ -25,7 +25,7 @@ function setDisplayCompact() {
|
||||
}
|
||||
|
||||
function setDisplayLine() {
|
||||
$(".pluginContainer").addClass("line").removeClass("compact").removeClass("classic");
|
||||
$(".pluginContainer").addClass("line-form").removeClass("compact-form").removeClass("classic-form");
|
||||
|
||||
$(".pluginDesc").show();
|
||||
$(".pluginDescCompact").hide();
|
||||
|
||||
@@ -332,23 +332,28 @@ 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" {if $count_types_plugins["active"] <= 0} checked {/if}><label for="seeAll">{'All'|@translate}<span class="filter-badge">X</span></label><input type="radio" name="p-filter" class="filter" id="seeActive" {if $count_types_plugins["active"] > 0} checked {/if}><label class="filterLabel" for="seeActive">{'Activated'|@translate}<span class="filter-badge">X</span></label><input type="radio" name="p-filter" class="filter" id="seeInactive"><label class="filterLabel" for="seeInactive">{'Deactivated'|@translate}<span class="filter-badge">X</span></label><input type="radio" name="p-filter" class="filter" id="seeOther"><label class="filterLabel" for="seeOther">{'Other'|@translate}<span class="filter-badge">X</span></label>
|
||||
<div class="pluginInstalledFilters">
|
||||
<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="nbPluginsSearch"></div>
|
||||
|
||||
<div class="pluginFilter">
|
||||
<span class="icon-search search-icon"></span>
|
||||
<span class="icon-cancel search-cancel"></span>
|
||||
<input class='search-input' type="text" placeholder="{'Search'|@translate}">
|
||||
</div>
|
||||
|
||||
<div class="AlbumViewSelector">
|
||||
<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>
|
||||
|
||||
<div class="nbPluginsSearch"></div>
|
||||
<div class="emptyResearch"> {'No plugins found'|@translate} </div>
|
||||
|
||||
<div class="pluginFilter">
|
||||
<span class="icon-search search-icon"></span>
|
||||
<span class="icon-cancel search-cancel"></span>
|
||||
<input class='search-input' type="text" placeholder="{'Search'|@translate}">
|
||||
</div>
|
||||
|
||||
<div class="AlbumViewSelector">
|
||||
<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="pluginContainer {if $smarty.cookies.pwg_plugin_manager_view == 'classic'} classic {elseif $smarty.cookies.pwg_plugin_manager_view == 'line'} line {elseif $smarty.cookies.pwg_plugin_manager_view == 'compact'} compact {else} {/if}">
|
||||
<div class="pluginContainer {if $smarty.cookies.pwg_plugin_manager_view == 'classic'} classic-form {elseif $smarty.cookies.pwg_plugin_manager_view == 'line'} line-form {elseif $smarty.cookies.pwg_plugin_manager_view == 'compact'} compact-form {else} {/if}">
|
||||
|
||||
{foreach from=$plugins item=plugin name=plugins_loop}
|
||||
|
||||
@@ -475,346 +480,4 @@ jQuery(".pluginMiniBox").each(function(index){
|
||||
</div>
|
||||
{/foreach}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
|
||||
<style>
|
||||
|
||||
.AlbumViewSelector {
|
||||
position: absolute;
|
||||
|
||||
right: 20px;
|
||||
z-index: 2;
|
||||
|
||||
height: 43px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
transform: translateY(6px);
|
||||
}
|
||||
|
||||
.AlbumViewSelector {
|
||||
padding: 0px;
|
||||
margin-right: 0px;
|
||||
border-radius: 7px;
|
||||
}
|
||||
|
||||
.AlbumViewSelector span {
|
||||
border-radius: 0;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
/* Should be done with :first-child and :last-child but doesn't work */
|
||||
|
||||
.AlbumViewSelector label span.firstIcon{
|
||||
border-radius: 7px 0 0 7px;
|
||||
}
|
||||
|
||||
.AlbumViewSelector label span.lastIcon{
|
||||
border-radius: 0 7px 7px 0;
|
||||
}
|
||||
|
||||
.icon-th-large, .icon-th-list, .icon-pause {
|
||||
padding: 10px;
|
||||
font-size: 19px;
|
||||
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.switchLayout {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/****************************************/
|
||||
|
||||
.pluginActionsSmallIcons a, .PluginOptionsIcons a{
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.pluginActionsSmallIcons a:hover, .PluginOptionsIcons a:hover {
|
||||
color: #000000;
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
.pluginActionsSmallIcons {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
padding: 13px;
|
||||
top: 0px;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.pluginBox.active .pluginActionsSmallIcons a span {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
padding: 5px 2px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.pluginBox.active .pluginActionsSmallIcons a span:hover {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
padding: 5px 2px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.pluginBox.inactive .pluginActionsSmallIcons a span {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
padding: 5px 2px;
|
||||
background: #e0e0e0;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.pluginActionsSmallIcons a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.pluginBox {
|
||||
transition: 0.5s;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.unavailablePlugin {
|
||||
cursor: default;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.unavailablePlugin:hover {
|
||||
cursor: default;
|
||||
color: #3a3a3a !important;
|
||||
}
|
||||
|
||||
.pluginUnavailableAction {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
|
||||
.pluginDescCompact {
|
||||
max-width: 200px;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.dropdown-option-content {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.separator-top {
|
||||
border-top: 1px solid #ffffff45;
|
||||
}
|
||||
|
||||
.dropdown-option.icon-cancel-circled {
|
||||
margin-bottom: -5px;
|
||||
}
|
||||
|
||||
.dropdown-option {
|
||||
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 label,
|
||||
.DeactivatePluginSuccess label,
|
||||
.RestorePluginSuccess label {
|
||||
padding: 10px;
|
||||
cursor: default;
|
||||
border-radius: 30px;
|
||||
}
|
||||
|
||||
.PluginActionError label {
|
||||
padding: 10px;
|
||||
cursor: default;
|
||||
border-radius: 30px;
|
||||
}
|
||||
|
||||
/* Line view */
|
||||
|
||||
.pluginContainer.line {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-shadow: none;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.pluginContainer.line .pluginBox {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
|
||||
margin: 0 0 10px 0;
|
||||
}
|
||||
|
||||
.pluginContainer.line .pluginBox .pluginContent{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
width: calc(100% - 35px);
|
||||
}
|
||||
|
||||
.pluginContainer.line .pluginBox .pluginActions{
|
||||
width: auto;
|
||||
margin: 0 25px 0 auto;
|
||||
}
|
||||
|
||||
.pluginContainer.line .pluginBox .PluginOptionsBlock{
|
||||
display:none;
|
||||
position:absolute;
|
||||
right: 30px;
|
||||
top: 0;
|
||||
z-index: 2;
|
||||
transform: translateY(calc(50% - 30px));
|
||||
}
|
||||
|
||||
.pluginContainer.line .pluginBox .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 .pluginBox .pluginActions a,
|
||||
.pluginContainer.classic .pluginBox .pluginActions a{
|
||||
margin: 0;
|
||||
padding: 2px 10px;
|
||||
border-radius: 5px;
|
||||
color: #3c3c3c;
|
||||
}
|
||||
|
||||
.pluginContainer.line .pluginBox .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 .pluginName {
|
||||
position: relative;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.pluginContainer.classic .switch {
|
||||
position: absolute;
|
||||
top: 45px;
|
||||
}
|
||||
|
||||
.pluginContainer.classic .pluginBox .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 .pluginBox {
|
||||
width: 350px;
|
||||
|
||||
margin: 15px 15px 0 0;
|
||||
}
|
||||
|
||||
.pluginContainer.compact .pluginBox .pluginContent {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.filter-badge {
|
||||
border-radius: 20px;
|
||||
text-align: center;
|
||||
padding: 0px 7px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.pluginMiniBox.incompatible .pluginMiniBoxNameCell i {
|
||||
color:#c64444;
|
||||
}
|
||||
|
||||
.nbPluginsSearch {
|
||||
position: absolute;
|
||||
right: 415px;
|
||||
transform: translateY(18px);
|
||||
}
|
||||
</style>
|
||||
{/if}
|
||||
@@ -43,6 +43,7 @@ function resetIgnored() {
|
||||
success: function(data) {
|
||||
if (data['stat'] == 'ok') {
|
||||
jQuery(".pluginBox, fieldset").show();
|
||||
jQuery(".pluginBox").attr('data-ignored', 'false')
|
||||
jQuery("#update_all").show();
|
||||
jQuery("#ignore_all").show();
|
||||
jQuery("#up_to_date").hide();
|
||||
@@ -60,11 +61,11 @@ function checkFieldsets() {
|
||||
var ignored = 0;
|
||||
for (i=0;i<3;i++) {
|
||||
nbExtensions = 0;
|
||||
jQuery("div[id^='"+types[i]+"_']").each(function(index) {
|
||||
if (jQuery(this).css('display') == 'block')
|
||||
nbExtensions++;
|
||||
else
|
||||
jQuery("fieldset[data-type="+types[i]+"] .pluginBox").each(function(index) {
|
||||
if (jQuery(this).attr('data-ignored')== 'true')
|
||||
ignored++;
|
||||
else
|
||||
nbExtensions++;
|
||||
});
|
||||
total = total + nbExtensions;
|
||||
if (nbExtensions == 0)
|
||||
@@ -111,6 +112,7 @@ function ignoreExtension(type, id) {
|
||||
success: function(data) {
|
||||
if (data['stat'] == 'ok') {
|
||||
jQuery("#"+type+"_"+id).hide();
|
||||
jQuery("#"+type+"_"+id).attr('data-ignored', 'true')
|
||||
jQuery("#reset_ignore").show();
|
||||
checkFieldsets();
|
||||
}
|
||||
@@ -124,16 +126,6 @@ function autoupdate_bar_toggle(i) {
|
||||
jQuery('.autoupdate_bar').toggle();
|
||||
}
|
||||
|
||||
jQuery(document).ready(function() {
|
||||
jQuery("td[id^='desc_'], p[id^='revdesc_']").click(function() {
|
||||
id = this.id.split('_');
|
||||
jQuery("#revdesc_"+id[1]).toggle();
|
||||
jQuery(".button_"+id[1]).toggle();
|
||||
jQuery("#revdesc_"+id[1]).closest('tr').toggle();
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
checkFieldsets();
|
||||
{/literal}
|
||||
{/footer_script}
|
||||
@@ -183,130 +175,37 @@ $("#update_all").click(function() {
|
||||
|
||||
<p id="up_to_date" style="display:none; text-align:left; margin-left:20px;">{'All %s are up to date.'|@sprintf:$EXT_TYPE|@translate}</p>
|
||||
|
||||
{if not empty($update_plugins)}
|
||||
<div>
|
||||
<fieldset id="plugins">
|
||||
<legend>{'Plugins'|@translate}</legend>
|
||||
{foreach from=$update_plugins item=plugin name=plugins_loop}
|
||||
<div class="pluginBox" id="plugins_{$plugin.EXT_ID}" {if $plugin.IGNORED}style="display:none;"{/if}>
|
||||
<table>
|
||||
<tr>
|
||||
<td class="pluginName">
|
||||
{$plugin.EXT_NAME}
|
||||
</td>
|
||||
<td>
|
||||
<a href="#" onClick="updateExtension('plugins', '{$plugin.EXT_ID}', {$plugin.REVISION_ID});" class="updateExtension">{'Install'|@translate}</a>
|
||||
| <a href="{$plugin.URL_DOWNLOAD}">{'Download'|@translate}</a>
|
||||
| <a href="#" onClick="ignoreExtension('plugins', '{$plugin.EXT_ID}'); return false;" class="ignoreExtension">{'Ignore this update'|@translate}</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
{'Version'|@translate} {$plugin.CURRENT_VERSION}
|
||||
</td>
|
||||
<td class="pluginDesc" id="desc_{$plugin.ID}">
|
||||
<em>{'Downloads'|@translate}: {$plugin.DOWNLOADS}</em>
|
||||
<img src="{$ROOT_URL}{$themeconf.admin_icon_dir}/plus.gif" alt="" class="button_{$plugin.ID}">
|
||||
<img src="{$ROOT_URL}{$themeconf.admin_icon_dir}/minus.gif" alt="" class="button_{$plugin.ID}" style="display:none;">
|
||||
{'New Version'|@translate} : {$plugin.NEW_VERSION}
|
||||
| {'By %s'|@translate:$plugin.AUTHOR}
|
||||
</td>
|
||||
</tr>
|
||||
<tr style="display:none;">
|
||||
<td></td>
|
||||
<td class="pluginDesc">
|
||||
<p id="revdesc_{$plugin.ID}" style="display:none;">{$plugin.REV_DESC|@htmlspecialchars|@nl2br}</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
{/foreach}
|
||||
</fieldset>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
{if not empty($update_themes)}
|
||||
<div>
|
||||
<fieldset id="themes">
|
||||
<legend>{'Themes'|@translate}</legend>
|
||||
{foreach from=$update_themes item=theme name=themes_loop}
|
||||
<div class="pluginBox" id="themes_{$theme.EXT_ID}" {if $theme.IGNORED}style="display:none;"{/if}>
|
||||
<table>
|
||||
<tr>
|
||||
<td class="pluginName">
|
||||
{$theme.EXT_NAME}
|
||||
</td>
|
||||
<td>
|
||||
<a href="#" onClick="updateExtension('themes', '{$theme.EXT_ID}', {$theme.REVISION_ID});" class="updateExtension">{'Install'|@translate}</a>
|
||||
| <a href="{$theme.URL_DOWNLOAD}">{'Download'|@translate}</a>
|
||||
| <a href="#" onClick="ignoreExtension('themes', '{$theme.EXT_ID}'); return false;" class="ignoreExtension">{'Ignore this update'|@translate}</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr style="display:none;">
|
||||
<td>
|
||||
{'Version'|@translate} {$theme.CURRENT_VERSION}
|
||||
</td>
|
||||
<td class="pluginDesc" id="desc_{$theme.ID}">
|
||||
<em>{'Downloads'|@translate}: {$theme.DOWNLOADS}</em>
|
||||
<img src="{$ROOT_URL}{$themeconf.admin_icon_dir}/plus.gif" alt="" class="button_{$theme.ID}">
|
||||
<img src="{$ROOT_URL}{$themeconf.admin_icon_dir}/minus.gif" alt="" class="button_{$theme.ID}" style="display:none;">
|
||||
{'New Version'|@translate} : {$theme.NEW_VERSION}
|
||||
| {'By %s'|@translate:$theme.AUTHOR}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td class="pluginDesc">
|
||||
<p id="revdesc_{$theme.ID}" style="display:none;">{$theme.REV_DESC|@htmlspecialchars|@nl2br}</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
{/foreach}
|
||||
</fieldset>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
{if not empty($update_languages)}
|
||||
<div>
|
||||
<fieldset id="languages">
|
||||
<legend>{'Languages'|@translate}</legend>
|
||||
{foreach from=$update_languages item=language name=languages_loop}
|
||||
<div class="pluginBox" id="languages_{$language.EXT_ID}" {if $language.IGNORED}style="display:none;"{/if}>
|
||||
<table>
|
||||
<tr>
|
||||
<td class="pluginName">
|
||||
{$language.EXT_NAME}
|
||||
</td>
|
||||
<td>
|
||||
<a href="#" onClick="updateExtension('languages', '{$language.EXT_ID}', {$language.REVISION_ID});" class="updateExtension">{'Install'|@translate}</a>
|
||||
| <a href="{$language.URL_DOWNLOAD}">{'Download'|@translate}</a>
|
||||
| <a href="#" onClick="ignoreExtension('languages', '{$language.EXT_ID}'); return false;" class="ignoreExtension">{'Ignore this update'|@translate}</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
{'Version'|@translate} {$language.CURRENT_VERSION}
|
||||
</td>
|
||||
<td class="pluginDesc" id="desc_{$language.ID}">
|
||||
<em>{'Downloads'|@translate}: {$language.DOWNLOADS}</em>
|
||||
<img src="{$ROOT_URL}{$themeconf.admin_icon_dir}/plus.gif" alt="" class="button_{$language.ID}">
|
||||
<img src="{$ROOT_URL}{$themeconf.admin_icon_dir}/minus.gif" alt="" class="button_{$language.ID}" style="display:none;">
|
||||
{'New Version'|@translate} : {$language.NEW_VERSION}
|
||||
| {'By %s'|@translate:$language.AUTHOR}
|
||||
</td>
|
||||
</tr>
|
||||
<tr style="display:none;">
|
||||
<td></td>
|
||||
<td class="pluginDesc">
|
||||
<p id="revdesc_{$language.ID}" style="display:none;">{$language.REV_DESC|@htmlspecialchars|@nl2br}</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
{/foreach}
|
||||
</fieldset>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
{/if}
|
||||
{foreach from=$UPDATES_EXTENSION key=type item=updates}
|
||||
{if not empty($updates)}
|
||||
<fieldset id="{$type}" class="pluginContainer pluginUpdateContainer line-form" data-type="{$type}">
|
||||
<legend>
|
||||
{if $type=='plugins'}
|
||||
<span class="icon-puzzle icon-green"></span>{'Plugins'|@translate}
|
||||
{elseif $type=='themes'}
|
||||
<span class="icon-brush icon-blue"></span>{'Themes'|@translate}
|
||||
{elseif $type=='languages'}
|
||||
<span class="icon-language icon-purple"></span>{'Languages'|@translate}
|
||||
{/if}
|
||||
</legend>
|
||||
|
||||
{foreach from=$updates item=extension}
|
||||
<div class="pluginBox pluginMiniBox" id="{$type}_{$extension.EXT_ID}" {if $extension.IGNORED}data-ignored="true" style="display:none;"{/if}>
|
||||
<div class="pluginContent">
|
||||
<div class="pluginName">
|
||||
{$extension.EXT_NAME}
|
||||
</div>
|
||||
<div class="pluginDesc" id="desc_{$extension.ID}">
|
||||
{'New Version'|@translate} : {$extension.NEW_VERSION}
|
||||
| {'By %s'|@translate:$extension.AUTHOR}
|
||||
</div>
|
||||
<div class="pluginActions">
|
||||
<a href="#" onClick="updateExtension('{$type}', '{$extension.EXT_ID}', {$extension.REVISION_ID});" class="updateExtension pluginActionLevel1"> <i class="icon-ok-circled"></i> {'Install'|@translate}</a>
|
||||
<a href="{$extension.URL_DOWNLOAD}" class="pluginActionLevel2"> <i class="icon-plus-circled"></i> {'Download'|@translate}</a>
|
||||
<a href="#" onClick="ignoreExtension('{$type}', '{$extension.EXT_ID}'); return false;" class="ignoreExtension pluginActionLevel2"><i class="icon-block"></i>{'Ignore this update'|@translate}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/foreach}
|
||||
</fieldset>
|
||||
{/if}
|
||||
{/foreach}
|
||||
+378
-10
@@ -2303,6 +2303,19 @@ h2:lang(en) { text-transform:capitalize; }
|
||||
margin-top:15px;
|
||||
font-size:12px;
|
||||
}
|
||||
|
||||
.pluginUpdateContainer {
|
||||
margin-bottom: 5px !important;
|
||||
}
|
||||
|
||||
.pluginUpdateContainer legend{
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.pluginUpdateContainer .pluginActions {
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
/*
|
||||
.pluginActions > * {
|
||||
padding: 10px 4px;
|
||||
@@ -2310,19 +2323,43 @@ h2:lang(en) { text-transform:capitalize; }
|
||||
display:block;
|
||||
} */
|
||||
.pluginEmptyInput {width: 90px;}
|
||||
.pluginContent .pluginUnavailableAction {
|
||||
|
||||
.pluginActionLevel1, .pluginActionLevel2, .pluginUnavailableAction {
|
||||
color: #3c3c3c;
|
||||
margin: 0;
|
||||
font-weight:700;
|
||||
}
|
||||
|
||||
.pluginActionLevel1 {
|
||||
background-color: #ffc17e;
|
||||
font-weight: bold;
|
||||
padding: 2px 10px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.pluginActionLevel1:hover {
|
||||
background-color: #ff7700;
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.pluginActionLevel2 {
|
||||
padding-left:5px;
|
||||
}
|
||||
|
||||
.pluginUnavailableAction {
|
||||
opacity: 0.5;
|
||||
font-size: 12px;
|
||||
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;}
|
||||
.pluginActionLevel2 {padding:5px 0;}
|
||||
.pluginActionLevel3 {/*padding-left: 10px; opacity: 0.9;*/padding:5px 0}
|
||||
|
||||
.pluginUnavailableAction:hover {
|
||||
text-decoration: none;
|
||||
color: #3c3c3c !important;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.plugin-inactive .pluginContent{
|
||||
border:none;
|
||||
border-left: solid 5px #999999;
|
||||
@@ -2410,17 +2447,17 @@ h2:lang(en) { text-transform:capitalize; }
|
||||
background: #ffd7ad;
|
||||
}
|
||||
|
||||
.pluginContainer.line .pluginBox:hover.plugin-inactive .slider {
|
||||
.pluginContainer.line-form .pluginBox:hover.plugin-inactive .slider {
|
||||
transition: 0.4s;
|
||||
background: #999999;
|
||||
}
|
||||
|
||||
.pluginContainer.line .pluginBox:hover .pluginContent .pluginActions a{
|
||||
.pluginContainer.line-form .pluginBox:hover .pluginContent .pluginActions a{
|
||||
/* color: #ffffff; */
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.pluginContainer.line .pluginBox.inactive:hover .pluginContent .pluginActions a{
|
||||
.pluginContainer.line-form .pluginBox.inactive:hover .pluginContent .pluginActions a{
|
||||
background: transparent;
|
||||
opacity: 0.7;
|
||||
}
|
||||
@@ -2524,6 +2561,337 @@ h2:lang(en) { text-transform:capitalize; }
|
||||
|
||||
legend {text-align:left;}
|
||||
|
||||
/* Plugin page multiple views */
|
||||
|
||||
.AlbumViewSelector {
|
||||
position: absolute;
|
||||
|
||||
right: 20px;
|
||||
z-index: 2;
|
||||
|
||||
height: 43px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
transform: translateY(6px);
|
||||
}
|
||||
|
||||
.AlbumViewSelector {
|
||||
padding: 0px;
|
||||
margin-right: 0px;
|
||||
border-radius: 7px;
|
||||
}
|
||||
|
||||
.AlbumViewSelector span {
|
||||
border-radius: 0;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
/* Should be done with :first-child and :last-child but doesn't work */
|
||||
|
||||
.AlbumViewSelector label span.firstIcon{
|
||||
border-radius: 7px 0 0 7px;
|
||||
}
|
||||
|
||||
.AlbumViewSelector label span.lastIcon{
|
||||
border-radius: 0 7px 7px 0;
|
||||
}
|
||||
|
||||
.icon-th-large, .icon-th-list, .icon-pause {
|
||||
padding: 10px;
|
||||
font-size: 19px;
|
||||
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.switchLayout {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/****************************************/
|
||||
|
||||
.pluginActionsSmallIcons a, .PluginOptionsIcons a{
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.pluginActionsSmallIcons a:hover, .PluginOptionsIcons a:hover {
|
||||
color: #000000;
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
.pluginActionsSmallIcons {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
padding: 13px;
|
||||
top: 0px;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.pluginBox.active .pluginActionsSmallIcons a span {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
padding: 5px 2px;
|
||||
background: #ffc17e;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.pluginBox.active .pluginActionsSmallIcons a span:hover {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
padding: 5px 2px;
|
||||
background: #ff7700;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.pluginBox.inactive .pluginActionsSmallIcons a span {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
padding: 5px 2px;
|
||||
background: #e0e0e0;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.pluginActionsSmallIcons a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.pluginBox {
|
||||
transition: 0.5s;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.unavailablePlugin {
|
||||
cursor: default;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.unavailablePlugin:hover {
|
||||
cursor: default;
|
||||
color: #7f7f7f !important;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.pluginDescCompact {
|
||||
max-width: 200px;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.dropdown-option-content {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.separator-top {
|
||||
border-top: 1px solid #ffffff45;
|
||||
}
|
||||
|
||||
.dropdown-option.icon-cancel-circled {
|
||||
margin-bottom: -5px;
|
||||
}
|
||||
|
||||
.dropdown-option {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.pluginContainer {
|
||||
padding: 0 20px;
|
||||
margin : 0;
|
||||
}
|
||||
|
||||
.pluginInstalledFilters {
|
||||
height: 75px;
|
||||
}
|
||||
|
||||
.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-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.pluginContainer.line-form .pluginBox {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
|
||||
margin: 0 0 10px 0;
|
||||
}
|
||||
|
||||
.pluginContainer.line-form .pluginBox .pluginContent{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
width: calc(100% - 35px);
|
||||
}
|
||||
|
||||
.pluginContainer.line-form .pluginBox .pluginActions{
|
||||
width: auto;
|
||||
margin: 0 25px 0 auto;
|
||||
}
|
||||
|
||||
.pluginContainer.line-form .pluginBox .PluginOptionsBlock{
|
||||
display:none;
|
||||
position:absolute;
|
||||
right: 30px;
|
||||
top: 0;
|
||||
z-index: 2;
|
||||
transform: translateY(calc(50% - 30px));
|
||||
}
|
||||
|
||||
.pluginContainer.line-form .pluginBox .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-form .pluginBox .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-form {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.pluginContainer.classic-form .pluginName {
|
||||
position: relative;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.pluginContainer.classic-form .switch {
|
||||
position: absolute;
|
||||
top: 45px;
|
||||
}
|
||||
|
||||
.pluginContainer.classic-form .pluginBox .pluginActions {
|
||||
position: absolute;
|
||||
top: 47px;
|
||||
right: 17px;
|
||||
}
|
||||
|
||||
/* Compact view */
|
||||
|
||||
.plugin-inactive .pluginActionsSmallIcons a {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.pluginContainer.compact-form {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.pluginContainer.compact-form .pluginBox {
|
||||
width: 350px;
|
||||
|
||||
margin: 15px 15px 0 0;
|
||||
}
|
||||
|
||||
.pluginContainer.compact-form .pluginBox .pluginContent {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* local-layout */
|
||||
/* You can modify this file */
|
||||
|
||||
|
||||
@@ -288,11 +288,12 @@ a.stat-box:hover {
|
||||
#helpContent, #pLoaderPage, #ftpPage, #ftpPage LEGEND {color:#aaa;}
|
||||
|
||||
.pluginBox, .pluginContent, .groups .GroupContainer {background-color:#333;color:#999;border-right-color:#333; box-shadow: none;border-left: none;}
|
||||
.pluginContainer.line-form .pluginBox:hover .pluginContent {background: #1e1e1d;}
|
||||
|
||||
.pluginName {color:#aaa;}
|
||||
.pluginBox.incompatible {border-color:#800 !important;}
|
||||
.pluginActionLevel1, .pluginActionLevel2 {color: #333;}
|
||||
.pluginActionLevel2 {background-color: #bbbbbb;}
|
||||
.pluginActionLevel1 {color: #333;}
|
||||
.pluginActionLevel2 {color: #bbbbbb;}
|
||||
.pluginFilter {color: #c1c1c1;}
|
||||
.pluginFilter input {border-color: #c1c1c1;}
|
||||
.languageBox {background-color:#333;}
|
||||
|
||||
@@ -28,6 +28,8 @@ if (!$autoupdate->get_server_extensions())
|
||||
return; // TODO: remove this return and add a proper "page killer"
|
||||
}
|
||||
|
||||
$updates_extension = []; //The array of the updates of a type of extension is stored in $updates_extension[type]
|
||||
|
||||
foreach ($autoupdate->types as $type)
|
||||
{
|
||||
$fs = 'fs_'.$type;
|
||||
@@ -40,6 +42,8 @@ foreach ($autoupdate->types as $type)
|
||||
continue;
|
||||
}
|
||||
|
||||
$updates_extension[$type] = [];
|
||||
|
||||
foreach($fs_ext as $ext_id => $fs_ext)
|
||||
{
|
||||
if (!isset($fs_ext['extension']) or !isset($server_ext[$fs_ext['extension']]))
|
||||
@@ -51,7 +55,7 @@ foreach ($autoupdate->types as $type)
|
||||
|
||||
if (!safe_version_compare($fs_ext['version'], $ext_info['revision_name'], '>='))
|
||||
{
|
||||
$template->append('update_'.$type, array(
|
||||
array_push($updates_extension[$type], array(
|
||||
'ID' => $ext_info['extension_id'],
|
||||
'REVISION_ID' => $ext_info['revision_id'],
|
||||
'EXT_ID' => $ext_id,
|
||||
@@ -76,6 +80,7 @@ foreach ($autoupdate->types as $type)
|
||||
}
|
||||
}
|
||||
|
||||
$template->assign('UPDATES_EXTENSION', $updates_extension);
|
||||
$template->assign('SHOW_RESET', $show_reset);
|
||||
$template->assign('PWG_TOKEN', get_pwg_token());
|
||||
$template->assign('EXT_TYPE', $page['page'] == 'updates' ? 'extensions' : $page['page']);
|
||||
|
||||
Reference in New Issue
Block a user