Fixed performance of Plugins / Themes sort in the installation table

This commit is contained in:
Djamil Legato
2022-02-04 16:46:04 -08:00
parent a165b670f9
commit d0a41b8187
3 changed files with 107 additions and 41 deletions

View File

@@ -5,6 +5,7 @@
* Require **Grav 1.7.30** * Require **Grav 1.7.30**
* PageMedia can now be collapsed and thumbnails previewed smaller, in order to save room on the page. Selection will be remembered. * PageMedia can now be collapsed and thumbnails previewed smaller, in order to save room on the page. Selection will be remembered.
* DEPRECATED: Admin field `pages_list_display_field` is no longer available as an option [#2191](https://github.com/getgrav/grav-plugin-admin/issues/2191) * DEPRECATED: Admin field `pages_list_display_field` is no longer available as an option [#2191](https://github.com/getgrav/grav-plugin-admin/issues/2191)
* When listing installable themes/plugins, it is now possible to sort them by [Premium](https://getgrav.org/premium)
2. [](#improved) 2. [](#improved)
* Updated JavaScript dependencies * Updated JavaScript dependencies
* Cleaned up JavaScript unused dependencies and warnings, * Cleaned up JavaScript unused dependencies and warnings,
@@ -15,6 +16,7 @@
* Fixed issue uploading non-images media when Resolution setting enabled in Admin [#2172](https://github.com/getgrav/grav-plugin-admin/issues/2172) * Fixed issue uploading non-images media when Resolution setting enabled in Admin [#2172](https://github.com/getgrav/grav-plugin-admin/issues/2172)
* Prevent fields from being toggled incorrectly by adding originalValue to childs of fieldset. [#2218](https://github.com/getgrav/grav-plugin-admin/pull/2218) * Prevent fields from being toggled incorrectly by adding originalValue to childs of fieldset. [#2218](https://github.com/getgrav/grav-plugin-admin/pull/2218)
* Fixed persistent focus on Folder field when Adding page (Safari) [#2209](https://github.com/getgrav/grav-plugin-admin/issues/2209) * Fixed persistent focus on Folder field when Adding page (Safari) [#2209](https://github.com/getgrav/grav-plugin-admin/issues/2209)
* Fixed performance of Plugins / Themes sort in the installation table
# v1.10.29 # v1.10.29
## 01/28/2022 ## 01/28/2022

View File

@@ -5,8 +5,9 @@ import { Instance as gpm } from '../utils/gpm';
class Sorter { class Sorter {
getElements(elements, container) { getElements(elements, container) {
this.elements = elements || $('[data-gpm-plugin], [data-gpm-theme]'); this.elements = elements || document.querySelectorAll('[data-gpm-plugin], [data-gpm-theme]');
this.container = container || $('.gpm-plugins > table > tbody, .gpm-themes > .themes.card-row'); this.container = container || document.querySelector('.gpm-plugins > table > tbody, .gpm-themes > .themes.card-row');
return this.elements; return this.elements;
} }
@@ -18,50 +19,78 @@ class Sorter {
} }
byCommon(direction = 'asc', data = '') { byCommon(direction = 'asc', data = '') {
let elements = this.getElements().sort((a, b) => { const elements = this.getElements();
let A = $(a).data(data).toString().toLowerCase(); this.removeGumroad();
let B = $(b).data(data).toString().toLowerCase();
Array.from(elements).sort((a, b) => {
let A = a.dataset[data].toString().toLowerCase();
let B = b.dataset[data].toString().toLowerCase();
return Sorter.sort(A, B, direction); return Sorter.sort(A, B, direction);
}).forEach((element) => {
this.container.appendChild(element);
}); });
return elements.appendTo(this.container); this.addGumroad();
return this.container;
} }
byName(direction = 'asc', data = 'gpm-name') { byName(direction = 'asc', data = 'gpmName') {
return this.byCommon(direction, data); return this.byCommon(direction, data);
} }
byAuthor(direction = 'asc', data = 'gpm-author') { byAuthor(direction = 'asc', data = 'gpmAuthor') {
return this.byCommon(direction, data); return this.byCommon(direction, data);
} }
byOfficial(direction = 'asc', data = 'gpm-official') { byOfficial(direction = 'asc', data = 'gpmOfficial') {
return this.byCommon(direction, data); return this.byCommon(direction, data);
} }
byReleaseDate(direction = 'asc', data = 'gpm-release-date') { byPremium(direction = 'asc', data = 'gpmPremium') {
let elements = this.getElements().sort((a, b) => { return this.byCommon(direction, data);
let A = new Date($(a).data(data)).getTime(); }
let B = new Date($(b).data(data)).getTime();
byReleaseDate(direction = 'asc', data = 'gpmReleaseDate') {
const elements = this.getElements();
this.removeGumroad();
Array.from(elements).sort((a, b) => {
let A = new Date(a.dataset[data]).getTime();
let B = new Date(b.dataset[data]).getTime();
return Sorter.sort(A, B, direction === 'asc' ? 'desc' : 'asc'); return Sorter.sort(A, B, direction === 'asc' ? 'desc' : 'asc');
}).forEach((element) => {
this.container.appendChild(element);
}); });
elements.appendTo(this.container); this.addGumroad();
return this.container;
} }
byUpdatable(direction = 'asc', data = 'gpm-updatable') { byUpdatable(direction = 'asc', data = 'gpmUpdatable') {
return this.byCommon(direction, data); return this.byCommon(direction, data);
} }
byEnabled(direction = 'asc', data = 'gpm-enabled') { byEnabled(direction = 'asc', data = 'gpmEnabled') {
return this.byCommon(direction, data); return this.byCommon(direction, data);
} }
byTesting(direction = 'asc', data = 'gpm-testing') { byTesting(direction = 'asc', data = 'gpmTesting') {
return this.byCommon(direction, data); return this.byCommon(direction, data);
} }
addGumroad() {
if (window.GumroadOverlay) {
window.GumroadOverlay.startNodeAdditionObserver();
}
}
removeGumroad() {
if (window.GumroadOverlay) {
window.GumroadOverlay.nodeAdditionObserver.disconnect();
}
}
} }
class Packages { class Packages {

View File

@@ -9779,76 +9779,111 @@ var Sorter = /*#__PURE__*/function () {
packages_createClass(Sorter, [{ packages_createClass(Sorter, [{
key: "getElements", key: "getElements",
value: function getElements(elements, container) { value: function getElements(elements, container) {
this.elements = elements || external_jQuery_default()('[data-gpm-plugin], [data-gpm-theme]'); this.elements = elements || document.querySelectorAll('[data-gpm-plugin], [data-gpm-theme]');
this.container = container || external_jQuery_default()('.gpm-plugins > table > tbody, .gpm-themes > .themes.card-row'); this.container = container || document.querySelector('.gpm-plugins > table > tbody, .gpm-themes > .themes.card-row');
return this.elements; return this.elements;
} }
}, { }, {
key: "byCommon", key: "byCommon",
value: function byCommon() { value: function byCommon() {
var _this = this;
var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc'; var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc';
var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : ''; var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
var elements = this.getElements().sort(function (a, b) { var elements = this.getElements();
var A = external_jQuery_default()(a).data(data).toString().toLowerCase(); this.removeGumroad();
var B = external_jQuery_default()(b).data(data).toString().toLowerCase(); Array.from(elements).sort(function (a, b) {
var A = a.dataset[data].toString().toLowerCase();
var B = b.dataset[data].toString().toLowerCase();
return Sorter.sort(A, B, direction); return Sorter.sort(A, B, direction);
}).forEach(function (element) {
_this.container.appendChild(element);
}); });
return elements.appendTo(this.container); this.addGumroad();
return this.container;
} }
}, { }, {
key: "byName", key: "byName",
value: function byName() { value: function byName() {
var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc'; var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc';
var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'gpm-name'; var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'gpmName';
return this.byCommon(direction, data); return this.byCommon(direction, data);
} }
}, { }, {
key: "byAuthor", key: "byAuthor",
value: function byAuthor() { value: function byAuthor() {
var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc'; var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc';
var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'gpm-author'; var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'gpmAuthor';
return this.byCommon(direction, data); return this.byCommon(direction, data);
} }
}, { }, {
key: "byOfficial", key: "byOfficial",
value: function byOfficial() { value: function byOfficial() {
var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc'; var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc';
var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'gpm-official'; var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'gpmOfficial';
return this.byCommon(direction, data);
}
}, {
key: "byPremium",
value: function byPremium() {
var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc';
var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'gpmPremium';
return this.byCommon(direction, data); return this.byCommon(direction, data);
} }
}, { }, {
key: "byReleaseDate", key: "byReleaseDate",
value: function byReleaseDate() { value: function byReleaseDate() {
var _this2 = this;
var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc'; var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc';
var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'gpm-release-date'; var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'gpmReleaseDate';
var elements = this.getElements().sort(function (a, b) { var elements = this.getElements();
var A = new Date(external_jQuery_default()(a).data(data)).getTime(); this.removeGumroad();
var B = new Date(external_jQuery_default()(b).data(data)).getTime(); Array.from(elements).sort(function (a, b) {
var A = new Date(a.dataset[data]).getTime();
var B = new Date(b.dataset[data]).getTime();
return Sorter.sort(A, B, direction === 'asc' ? 'desc' : 'asc'); return Sorter.sort(A, B, direction === 'asc' ? 'desc' : 'asc');
}).forEach(function (element) {
_this2.container.appendChild(element);
}); });
elements.appendTo(this.container); this.addGumroad();
return this.container;
} }
}, { }, {
key: "byUpdatable", key: "byUpdatable",
value: function byUpdatable() { value: function byUpdatable() {
var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc'; var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc';
var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'gpm-updatable'; var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'gpmUpdatable';
return this.byCommon(direction, data); return this.byCommon(direction, data);
} }
}, { }, {
key: "byEnabled", key: "byEnabled",
value: function byEnabled() { value: function byEnabled() {
var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc'; var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc';
var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'gpm-enabled'; var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'gpmEnabled';
return this.byCommon(direction, data); return this.byCommon(direction, data);
} }
}, { }, {
key: "byTesting", key: "byTesting",
value: function byTesting() { value: function byTesting() {
var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc'; var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'asc';
var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'gpm-testing'; var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'gpmTesting';
return this.byCommon(direction, data); return this.byCommon(direction, data);
} }
}, {
key: "addGumroad",
value: function addGumroad() {
if (window.GumroadOverlay) {
window.GumroadOverlay.startNodeAdditionObserver();
}
}
}, {
key: "removeGumroad",
value: function removeGumroad() {
if (window.GumroadOverlay) {
window.GumroadOverlay.nodeAdditionObserver.disconnect();
}
}
}], [{ }], [{
key: "sort", key: "sort",
value: function sort(A, B) { value: function sort(A, B) {
@@ -9887,7 +9922,7 @@ var Packages = /*#__PURE__*/function () {
}, { }, {
key: "removePackage", key: "removePackage",
value: function removePackage(type, slug) { value: function removePackage(type, slug) {
var _this = this; var _this3 = this;
var url = Packages.getRemovePackageUrl(type); var url = Packages.getRemovePackageUrl(type);
utils_request(url, { utils_request(url, {
@@ -9900,7 +9935,7 @@ var Packages = /*#__PURE__*/function () {
external_jQuery_default()('.remove-package-confirm').addClass('hidden'); external_jQuery_default()('.remove-package-confirm').addClass('hidden');
if (response.dependencies && response.dependencies.length > 0) { if (response.dependencies && response.dependencies.length > 0) {
_this.addDependenciesToList(response.dependencies); _this3.addDependenciesToList(response.dependencies);
external_jQuery_default()('.remove-package-dependencies').removeClass('hidden'); external_jQuery_default()('.remove-package-dependencies').removeClass('hidden');
} else { } else {
@@ -9946,7 +9981,7 @@ var Packages = /*#__PURE__*/function () {
}, { }, {
key: "removeDependency", key: "removeDependency",
value: function removeDependency(type, slug, button) { value: function removeDependency(type, slug, button) {
var _this2 = this; var _this4 = this;
var url = Packages.getRemovePackageUrl(type); var url = Packages.getRemovePackageUrl(type);
utils_request(url, { utils_request(url, {
@@ -9960,7 +9995,7 @@ var Packages = /*#__PURE__*/function () {
button.replaceWith(external_jQuery_default()('<span>Removed successfully</span>')); button.replaceWith(external_jQuery_default()('<span>Removed successfully</span>'));
if (response.dependencies && response.dependencies.length > 0) { if (response.dependencies && response.dependencies.length > 0) {
_this2.addDependenciesToList(response.dependencies, slug); _this4.addDependenciesToList(response.dependencies, slug);
} }
} }
}); });
@@ -10096,7 +10131,7 @@ var Packages = /*#__PURE__*/function () {
}, { }, {
key: "handleInstallingDependenciesAndPackage", key: "handleInstallingDependenciesAndPackage",
value: function handleInstallingDependenciesAndPackage(type, event) { value: function handleInstallingDependenciesAndPackage(type, event) {
var _this3 = this; var _this5 = this;
var slugs = Packages.getSlugsFromEvent(event); var slugs = Packages.getSlugsFromEvent(event);
event.preventDefault(); event.preventDefault();
@@ -10108,7 +10143,7 @@ var Packages = /*#__PURE__*/function () {
external_jQuery_default()('[data-packages-modal] .installing-dependencies').addClass('hidden'); external_jQuery_default()('[data-packages-modal] .installing-dependencies').addClass('hidden');
external_jQuery_default()('[data-packages-modal] .installing-package').removeClass('hidden'); external_jQuery_default()('[data-packages-modal] .installing-package').removeClass('hidden');
_this3.installPackages(type, slugs, function () { _this5.installPackages(type, slugs, function () {
external_jQuery_default()('[data-packages-modal] .installing-package').addClass('hidden'); external_jQuery_default()('[data-packages-modal] .installing-package').addClass('hidden');
external_jQuery_default()('[data-packages-modal] .installation-complete').removeClass('hidden'); external_jQuery_default()('[data-packages-modal] .installation-complete').removeClass('hidden');