diff options
| author | dizzy <diosmosis@users.noreply.github.com> | 2022-03-28 01:23:27 +0300 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2022-03-28 01:23:27 +0300 |
| commit | 212a3346a0ca3441b63f20d361ad4c9369661114 (patch) | |
| tree | adfdfb2ceb27964d8984d13fbcdf55ef4e7df759 | |
| parent | 4110b2edadf6c40421a8767ffaa3d567f332c2b4 (diff) | |
[Vue] migrate PiwikMarketplaceController, piwik-marketplace directive and piwik-plugin-name directive (#18966)
* start migration
* finish migrating license key
* get UI test to pass locally
* remove angularjs file
* remove todo
* migrate PiwikMarketplaceController to vue
* apply review feedback
* unfinished commit
* migrate piwik-plugin-name directive, add types for dotdotdot, remove use of $location in broadcast.updatePopoverParamValue, add ability to reference vue directives in twig (for migrating twig code in the future)
* remove directive use
* try to fix random failure
* remove file from plugin php
* fix url update
* fix more URL changing issues. allow "query" to be obtained from GET as well as POST params so marketplace reporting page does not have to redirect to admin page when searching
* reapply vue directives to dotdotdot
23 files changed, 862 insertions, 319 deletions
diff --git a/package-lock.json b/package-lock.json index 67b43b8a2b..346f42f200 100644 --- a/package-lock.json +++ b/package-lock.json @@ -36,6 +36,7 @@ }, "devDependencies": { "@types/angular": "^1.8.2", + "@types/dotdotdot": "^1.6.36", "@types/jest": "^26.0.24", "@types/materialize-css": "^1.0.11", "@types/mousetrap": "^1.6.8", @@ -3871,6 +3872,12 @@ "@types/node": "*" } }, + "node_modules/@types/dotdotdot": { + "version": "1.6.36", + "resolved": "https://registry.npmjs.org/@types/dotdotdot/-/dotdotdot-1.6.36.tgz", + "integrity": "sha512-QRUQ9d2UjCVAyttIMbULEK4qCPPMg3x6cDM3dSSsdC5neIRt/bDYYIqdnFdomMNosTVoFEFQMYA/eYtLB6GGYQ==", + "dev": true + }, "node_modules/@types/eslint": { "version": "7.28.0", "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-7.28.0.tgz", @@ -37669,6 +37676,12 @@ "@types/node": "*" } }, + "@types/dotdotdot": { + "version": "1.6.36", + "resolved": "https://registry.npmjs.org/@types/dotdotdot/-/dotdotdot-1.6.36.tgz", + "integrity": "sha512-QRUQ9d2UjCVAyttIMbULEK4qCPPMg3x6cDM3dSSsdC5neIRt/bDYYIqdnFdomMNosTVoFEFQMYA/eYtLB6GGYQ==", + "dev": true + }, "@types/eslint": { "version": "7.28.0", "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-7.28.0.tgz", diff --git a/package.json b/package.json index 92c7bcb619..d4b3143af5 100644 --- a/package.json +++ b/package.json @@ -54,6 +54,7 @@ }, "devDependencies": { "@types/angular": "^1.8.2", + "@types/dotdotdot": "^1.6.36", "@types/jest": "^26.0.24", "@types/materialize-css": "^1.0.11", "@types/mousetrap": "^1.6.8", diff --git a/plugins/CoreHome/javascripts/broadcast.js b/plugins/CoreHome/javascripts/broadcast.js index fe3b262b32..44ace8fe19 100644 --- a/plugins/CoreHome/javascripts/broadcast.js +++ b/plugins/CoreHome/javascripts/broadcast.js @@ -504,8 +504,6 @@ var broadcast = { * handler. */ propagateNewPopoverParameter: function (handlerName, value) { - var $location = angular.element(document).injector().get('$location'); - var popover = ''; if (handlerName && '' != value && 'undefined' != typeof value) { popover = handlerName + ':' + value; @@ -524,15 +522,10 @@ var broadcast = { } } - var $window = piwikHelper.getAngularDependency('$window'); - var urlStr = $window.location.hash; - urlStr = broadcast.updateParamValue('popover=' + encodeURIComponent(popover), urlStr); - urlStr = urlStr.replace(/^[#?]+/, ''); - $location.search(urlStr); - - setTimeout(function () { - angular.element(document).injector().get('$rootScope').$apply(); - }, 1); + var MatomoUrl = window.CoreHome.MatomoUrl; + MatomoUrl.updateHash( + Object.assign({}, MatomoUrl.hashParsed.value, { popover }), + ); }, /** diff --git a/plugins/CoreVue/types/index.d.ts b/plugins/CoreVue/types/index.d.ts index 49fd91baa5..4a0de71f22 100644 --- a/plugins/CoreVue/types/index.d.ts +++ b/plugins/CoreVue/types/index.d.ts @@ -54,6 +54,7 @@ declare global { setContent(html: string|HTMLElement|JQuery|JQLite): void; showLoading(loadingName: string, popoverSubject?: string, height?: number, dialogClass?: string): JQuery; onClose(fn: () => void); + createPopupAndLoadUrl(url: string, loadingName: string, dialogClass?: string, ajaxRequest?: QueryParameters): void; } let Piwik_Popover: PiwikPopoverGlobal; @@ -88,6 +89,7 @@ declare global { registerShortcut(key: string, description: string, callback: (event: ExtendedKeyboardEvent) => void): void; compileAngularComponents(selector: JQuery|JQLite|HTMLElement|string, options?: CompileAngularComponentsOptions): void; compileVueEntryComponents(selector: JQuery|JQLite|HTMLElement|string): void; + compileVueDirectives(selector: JQuery|JQLite|HTMLElement|string): void; calculateEvolution(currentValue: number, pastValue?: number|null): number; sendContentAsDownload(filename: string, content: any, mimeType?: string): void; } @@ -101,9 +103,11 @@ declare global { isWidgetizeRequestWithoutSession(): boolean; updateParamValue(newParamValue: string, urlStr: string): string; propagateNewPage(str?: string, showAjaxLoading?: boolean, strHash?: string, paramsToRemove?: string[], wholeNewUrl?: string); + propagateNewPopoverParameter(handleName: string, value?: string); buildReportingUrl(ajaxUrl: string): string; isLoginPage(): boolean; resetPopoverStack(): void; + addPopoverHandler(handlerName: string, callback: (string) => void): void; popoverHandlers: Record<string, (param: string) => void>; } diff --git a/plugins/CustomDimensions/tests/UI/CustomDimensions_spec.js b/plugins/CustomDimensions/tests/UI/CustomDimensions_spec.js index b0ce39ee23..8aacff253d 100644 --- a/plugins/CustomDimensions/tests/UI/CustomDimensions_spec.js +++ b/plugins/CustomDimensions/tests/UI/CustomDimensions_spec.js @@ -175,9 +175,9 @@ describe("CustomDimensions", function () { await page.goto(reportUrlDimension3); await (await page.jQuery('.dataTable .subDataTable .value:contains(en):first')).click(); await page.waitForNetworkIdle(); - await page.waitForTimeout(100); - await (await page.jQuery('td.label:contains(en_US)')).hover(); - await page.waitForTimeout(100); + await page.waitForTimeout(200); + await (await page.jQuery('td.label:contains(en_US):visible')).hover(); + await page.waitForTimeout(200); await triggerRowAction('en_US', 'actionTransitions'); }); }); diff --git a/plugins/Marketplace/Controller.php b/plugins/Marketplace/Controller.php index f138a5b491..3436e34b05 100644 --- a/plugins/Marketplace/Controller.php +++ b/plugins/Marketplace/Controller.php @@ -209,7 +209,7 @@ class Controller extends \Piwik\Plugin\ControllerAdmin $view = $this->configureViewAndCheckPermission('@Marketplace/overview'); $show = Common::getRequestVar('show', 'plugins', 'string'); - $query = Common::getRequestVar('query', '', 'string', $_POST); + $query = Common::getRequestVar('query', '', 'string'); $sort = new Sort(); $sort = $sort->getSort(); diff --git a/plugins/Marketplace/Marketplace.php b/plugins/Marketplace/Marketplace.php index e043742518..8be0a63aee 100644 --- a/plugins/Marketplace/Marketplace.php +++ b/plugins/Marketplace/Marketplace.php @@ -55,16 +55,15 @@ class Marketplace extends \Piwik\Plugin public function getJsFiles(&$jsFiles) { $jsFiles[] = "node_modules/iframe-resizer/js/iframeResizer.min.js"; - - $jsFiles[] = "plugins/Marketplace/angularjs/plugins/plugin-name.directive.js"; - $jsFiles[] = "plugins/Marketplace/angularjs/marketplace/marketplace.controller.js"; - $jsFiles[] = "plugins/Marketplace/angularjs/marketplace/marketplace.directive.js"; } public function getClientSideTranslationKeys(&$translationKeys) { $translationKeys[] = 'Marketplace_LicenseKeyActivatedSuccess'; $translationKeys[] = 'Marketplace_LicenseKeyDeletedSuccess'; + $translationKeys[] = 'Marketplace_Show'; + $translationKeys[] = 'Marketplace_Sort'; + $translationKeys[] = 'General_Plugins'; $translationKeys[] = 'Marketplace_PaidPluginsNoLicenseKeyIntro'; $translationKeys[] = 'Marketplace_PaidPluginsWithLicenseKeyIntro'; $translationKeys[] = 'Marketplace_RemoveLicenseKey'; diff --git a/plugins/Marketplace/angularjs/marketplace/marketplace.controller.js b/plugins/Marketplace/angularjs/marketplace/marketplace.controller.js deleted file mode 100644 index adc146beb4..0000000000 --- a/plugins/Marketplace/angularjs/marketplace/marketplace.controller.js +++ /dev/null @@ -1,23 +0,0 @@ -/*! - * Matomo - free/libre analytics platform - * - * @link https://matomo.org - * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later - */ -(function () { - angular.module('piwikApp').controller('PiwikMarketplaceController', PiwikMarketplaceController); - - PiwikMarketplaceController.$inject = ['piwik']; - - function PiwikMarketplaceController(piwik) { - // remember to keep controller very simple. Create a service/factory (model) if needed - - this.changePluginSort = function () { - piwik.broadcast.propagateNewPage('query=&sort=' + this.pluginSort); - }; - - this.changePluginType = function () { - piwik.broadcast.propagateNewPage('query=&show=' + this.pluginType); - }; - } -})(); diff --git a/plugins/Marketplace/angularjs/marketplace/marketplace.directive.js b/plugins/Marketplace/angularjs/marketplace/marketplace.directive.js deleted file mode 100644 index 4df38744db..0000000000 --- a/plugins/Marketplace/angularjs/marketplace/marketplace.directive.js +++ /dev/null @@ -1,116 +0,0 @@ -/*! - * Matomo - free/libre analytics platform - * - * @link https://matomo.org - * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later - */ - -/** - * Usage: - * <div piwik-marketplace> - */ -(function () { - - angular.module('piwikApp').directive('piwikMarketplace', piwikMarketplace); - - piwikMarketplace.$inject = ['piwik', '$timeout']; - - function piwikMarketplace(piwik, $timeout){ - - return { - restrict: 'A', - compile: function (element, attrs) { - - return function (scope, element, attrs) { - - $timeout(function () { - - - $('.installAllPaidPlugins').click(function (event) { - event.preventDefault(); - - piwikHelper.modalConfirm('#installAllPaidPluginsAtOnce'); - }); - - // Keeps the plugin descriptions the same height - $('.marketplace .plugin .description').dotdotdot({ - after: 'a.more', - watch: 'window' - }); - - piwik.helper.compileAngularComponents(element.find('[piwik-plugin-name]')); - - function syncMaxHeight2 (selector) { - - if (!selector) { - return; - } - - var $nodes = $(selector); - - if (!$nodes || !$nodes.length) { - return; - } - - var maxh3 = null; - var maxMeta = null; - var maxFooter = null; - var nodesToUpdate = []; - var lastTop = 0; - $nodes.each(function (index, node) { - var $node = $(node); - var top = $node.offset().top; - - if (lastTop !== top) { - nodesToUpdate = []; - lastTop = top; - maxh3 = null; - maxMeta = null; - maxFooter = null; - } - - nodesToUpdate.push($node); - - var heightH3 = $node.find('h3').height(); - var heightMeta = $node.find('.metadata').height(); - var heightFooter = $node.find('.footer').height(); - - if (!maxh3) { - maxh3 = heightH3; - } else if (maxh3 < heightH3) { - maxh3 = heightH3; - } - - if (!maxMeta) { - maxMeta = heightMeta; - } else if (maxMeta < heightMeta) { - maxMeta = heightMeta; - } - - if (!maxFooter) { - maxFooter = heightFooter; - } else if (maxFooter < heightFooter) { - maxFooter = heightFooter; - } - - $.each(nodesToUpdate, function (index, $node) { - if (maxh3) { - $node.find('h3').height(maxh3 + 'px'); - } - if (maxMeta) { - $node.find('.metadata').height(maxMeta + 'px'); - } - if (maxFooter) { - $node.find('.footer').height(maxFooter + 'px'); - } - }); - }); - } - syncMaxHeight2('.marketplace .plugin'); - - }); - }; - } - }; - } -})(); diff --git a/plugins/Marketplace/angularjs/plugins/plugin-name.directive.js b/plugins/Marketplace/angularjs/plugins/plugin-name.directive.js deleted file mode 100644 index 17edd4b50e..0000000000 --- a/plugins/Marketplace/angularjs/plugins/plugin-name.directive.js +++ /dev/null @@ -1,65 +0,0 @@ -/*! - * Matomo - free/libre analytics platform - * - * @link https://matomo.org - * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later - */ - -/** - * Usage: - * <div piwik-plugin-name="MyPluginName" [data-activeplugintab="changelog"]> - */ -(function () { - - broadcast.addPopoverHandler('browsePluginDetail', function (value) { - var pluginName = value; - var activeTab = null; - - if (-1 !== value.indexOf('!')) { - activeTab = value.substr(value.indexOf('!') + 1); - pluginName = value.substr(0, value.indexOf('!')); - } - - var url = 'module=Marketplace&action=pluginDetails&pluginName=' + encodeURIComponent(pluginName); - - if (activeTab) { - url += '&activeTab=' + encodeURIComponent(activeTab); - } - - Piwik_Popover.createPopupAndLoadUrl(url, 'details'); - }); - - angular.module('piwikApp').directive('piwikPluginName', piwikPluginName); - - piwikPluginName.$inject = ['piwik']; - - function piwikPluginName(piwik){ - - return { - restrict: 'A', - compile: function (element, attrs) { - - return function (scope, element, attrs) { - - var pluginName = attrs.piwikPluginName; - var activeTab = attrs.activeplugintab; - - if (!pluginName) { - return; - } - - element.on('click', function (event) { - event.preventDefault(); - - if (activeTab) { - pluginName += '!' + activeTab; - } - - broadcast.propagateNewPopoverParameter('browsePluginDetail', pluginName); - }); - - }; - } - }; - } -})();
\ No newline at end of file diff --git a/plugins/Marketplace/lang/en.json b/plugins/Marketplace/lang/en.json index c139182f02..a9f3266480 100644 --- a/plugins/Marketplace/lang/en.json +++ b/plugins/Marketplace/lang/en.json @@ -116,6 +116,8 @@ "LicenseKeyIsExpired": "Your license key is expired, please contact %1$s.", "MultiServerEnvironmentWarning": "You cannot install or update the plugin directly as you are using Matomo on multiple servers. The plugin would be only installed on one server. Instead, download the plugin and deploy it manually to all your servers.", "AutoUpdateDisabledWarning": "You cannot install or update the plugin directly as automatic updates are disabled in the config. To enable automatic updates set %1$s in %2$s.", - "ViewRepositoryChangelog": "View the changes" + "ViewRepositoryChangelog": "View the changes", + "Show": "Show", + "Sort": "Sort" } }
\ No newline at end of file diff --git a/plugins/Marketplace/templates/overview.twig b/plugins/Marketplace/templates/overview.twig index c55c047a92..81c43d97e1 100644 --- a/plugins/Marketplace/templates/overview.twig +++ b/plugins/Marketplace/templates/overview.twig @@ -4,7 +4,7 @@ {% block content %} - <div class="marketplace" piwik-marketplace> + <div class="marketplace"> <div piwik-content-intro> <h2 piwik-enriched-headline feature-name="{{ 'CorePluginsAdmin_Marketplace'|translate }}" @@ -28,46 +28,20 @@ {{ 'Marketplace_NoticeRemoveMarketplaceFromReportingMenu'|translate('<a href="#" piwik-plugin-name="WhiteLabel">', '</a>')|raw }} {% endif %} </p> - {% include '@Marketplace/licenseform.twig' %} {% include '@Marketplace/uploadPluginDialog.twig' %} - <div class="row marketplaceActions" ng-controller="PiwikMarketplaceController as marketplace"> - <div piwik-field uicontrol="select" name="plugin_type" - class="col s12 m6 l4" - ng-model="marketplace.pluginType" - ng-change="marketplace.changePluginType()" - data-title="{{ 'Show'|translate|e('html_attr') }}" - value="{{ pluginType }}" - full-width="true" - options="{{ pluginTypeOptions|json_encode }}"> - </div> - - <div piwik-field uicontrol="select" name="plugin_sort" - data-title="{{ 'Sort'|translate|e('html_attr') }}" - value="{{ sort }}" - ng-model="marketplace.pluginSort" - ng-change="marketplace.changePluginSort()" - class="col s12 m6 l4" - full-width="true" - options="{{ pluginSortOptions|json_encode }}"> - </div> - - {# Hide filters and search for themes because we don't have many of them #} - {% if (pluginsToShow|length) > 20 or query %} - <div class="col s12 m12 l4 "> - <form action="{{ linkTo({'sort': '', 'embed': '0'}) }}" method="post" class="plugin-search"> - <div piwik-field uicontrol="text" name="query" - data-title="{{ 'General_Search'|translate }} {{ numAvailablePlugins }} {{ 'General_Plugins'|translate|lcfirst }}..." - value="{{ query }}" - full-width="true"> - </div> - <span class="icon-search" onclick="$('form.plugin-search').submit();"></span> - </form> - </div> - {% endif %} - </div> + <div + vue-entry="Marketplace.Marketplace" + plugin-type="{{ pluginType|default(null)|json_encode|e('html_attr') }}" + plugin-type-options="{{ pluginTypeOptions|default(null)|json_encode|e('html_attr') }}" + sort="{{ sort|default(null)|json_encode|e('html_attr') }}" + plugin-sort-options="{{ pluginSortOptions|default(null)|json_encode|e('html_attr') }}" + plugins-to-show="{{ pluginsToShow|default(null)|json_encode|e('html_attr') }}" + query="{{ query|default(null)|json_encode|e('html_attr') }}" + num-available-plugins="{{ numAvailablePlugins|default(null)|json_encode|e('html_attr') }}" + ></div> </div> {% include '@Marketplace/plugin-list.twig' %} diff --git a/plugins/Marketplace/templates/plugin-list.twig b/plugins/Marketplace/templates/plugin-list.twig index d225ce5439..21c8165926 100644 --- a/plugins/Marketplace/templates/plugin-list.twig +++ b/plugins/Marketplace/templates/plugin-list.twig @@ -8,18 +8,18 @@ {% import '@CorePluginsAdmin/macros.twig' as pluginsMacro %} <div class="plugin"> <h3 class="card-title" title="{{ 'General_MoreDetails'|translate }}"> - <a href="#" piwik-plugin-name="{{ plugin.name }}">{{ plugin.displayName }}</a> + <a href="#" vue-directive="Marketplace.PluginName" vue-directive-value="{{ { pluginName: plugin.name }|json_encode|e('html_attr') }}">{{ plugin.displayName }}</a> </h3> <p class="description"> {{ plugin.description }} - <a class="more" href="#" piwik-plugin-name="{{ plugin.name }}" title="{{ 'General_MoreDetails'|translate }}"> + <a class="more" href="#" vue-directive="Marketplace.PluginName" vue-directive-value="{{ { pluginName: plugin.name }|json_encode|e('html_attr') }}" title="{{ 'General_MoreDetails'|translate }}"> › {{ 'General_MoreLowerCase'|translate }}</a> </p> {% if showThemes %} {# Screenshot for themes #} - <a class="more" href="#" piwik-plugin-name="{{ plugin.name }}"> + <a class="more" href="#" vue-directive="Marketplace.PluginName" vue-directive-value="{{ { pluginName: plugin.name }|json_encode|e('html_attr') }}"> <img title="{{ 'General_MoreDetails'|translate }}" class="preview" src="{{ plugin.screenshots|first }}?w=250&h=150"/></a> {% endif %} @@ -36,7 +36,7 @@ {% if plugin.changelog is defined and plugin.changelog and plugin.changelog.url is defined and plugin.changelog.url %} target="_blank" href="{{ plugin.changelog.url|e('html_attr') }}" {% else %} - href="#" piwik-plugin-name="{{ plugin.name }}" + href="#" vue-directive="Marketplace.PluginName" vue-directive-value="{{ { pluginName: plugin.name }|json_encode|e('html_attr') }}" {% endif %} title="{{ 'Marketplace_PluginUpdateAvailable'|translate(plugin.currentVersion, plugin.latestVersion) }}"> {{ 'Marketplace_NewVersion'|translate }}</a> @@ -54,7 +54,7 @@ {% macro moreDetailsLink(plugin) %} {% set canBePurchased = not plugin.isDownloadable and plugin.shop is defined and plugin.shop and plugin.shop.url %} - <a class="btn btn-block plugin-details {% if canBePurchased %}purchaseable{% endif %}" href="#" piwik-plugin-name="{{ plugin.name }}" title="{{ 'General_MoreDetails'|translate }}"> + <a class="btn btn-block plugin-details {% if canBePurchased %}purchaseable{% endif %}" href="#" vue-directive="Marketplace.PluginName" vue-directive-value="{{ { pluginName: plugin.name }|json_encode|e('html_attr') }}" title="{{ 'General_MoreDetails'|translate }}"> {% if canBePurchased and plugin.shop.variations %} {% set foundCheapest = 0 %} @@ -82,14 +82,14 @@ <div class="alert alert-danger" > {{ 'Marketplace_LicenseMissing'|translate }} - <span style="white-space:nowrap">(<a class="plugin-details" href="#" piwik-plugin-name="{{ plugin.name }}" title="{{ 'General_MoreDetails'|translate }}">{{ 'General_Help'|translate }}</a>)</span> + <span style="white-space:nowrap">(<a class="plugin-details" href="#" vue-directive="Marketplace.PluginName" vue-directive-value="{{ { pluginName: plugin.name }|json_encode|e('html_attr') }}" title="{{ 'General_MoreDetails'|translate }}">{{ 'General_Help'|translate }}</a>)</span> </div> {% elseif plugin.hasExceededLicense is defined and plugin.hasExceededLicense %} <div class="alert alert-danger"> {{ 'Marketplace_LicenseExceeded'|translate }} - <span style="white-space:nowrap">(<a class="plugin-details" href="#" piwik-plugin-name="{{ plugin.name }}" title="{{ 'General_MoreDetails'|translate }}">{{ 'General_Help'|translate }}</a>)</span> + <span style="white-space:nowrap">(<a class="plugin-details" href="#" vue-directive="Marketplace.PluginName" vue-directive-value="{{ { pluginName: plugin.name }|json_encode|e('html_attr') }}" title="{{ 'General_MoreDetails'|translate }}">{{ 'General_Help'|translate }}</a>)</span> </div> {% elseif plugin.canBeUpdated and 0 == plugin.missingRequirements|length and isAutoUpdatePossible %} @@ -110,7 +110,7 @@ {% if plugin.canBeUpdated and 0 == plugin.missingRequirements|length %} {{ 'Marketplace_CannotUpdate'|translate }} - <span style="white-space:nowrap">(<a class="plugin-details" href="#" piwik-plugin-name="{{ plugin.name }}" title="{{ 'General_MoreDetails'|translate }}">{{ 'General_Help'|translate }}</a>{{ _self.downloadButton(true, plugin, isAutoUpdatePossible)|raw }})</span> + <span style="white-space:nowrap">(<a class="plugin-details" href="#" vue-directive="Marketplace.PluginName" vue-directive-value="{{ { pluginName: plugin.name }|json_encode|e('html_attr') }}" title="{{ 'General_MoreDetails'|translate }}">{{ 'General_Help'|translate }}</a>{{ _self.downloadButton(true, plugin, isAutoUpdatePossible)|raw }})</span> {% elseif plugin.isInstalled %} {{ 'General_Installed'|translate }} {{ _self.downloadButton(false, plugin, isAutoUpdatePossible, true)|raw }} @@ -119,7 +119,7 @@ {% else %} {{ 'Marketplace_CannotInstall'|translate }} - <span style="white-space:nowrap">(<a class="plugin-details" href="#" piwik-plugin-name="{{ plugin.name }}" title="{{ 'General_MoreDetails'|translate }}">{{ 'General_Help'|translate }}</a>{{ _self.downloadButton(true, plugin, isAutoUpdatePossible)|raw }})</span> + <span style="white-space:nowrap">(<a class="plugin-details" href="#" vue-directive="Marketplace.PluginName" vue-directive-value="{{ { pluginName: plugin.name }|json_encode|e('html_attr') }}" title="{{ 'General_MoreDetails'|translate }}">{{ 'General_Help'|translate }}</a>{{ _self.downloadButton(true, plugin, isAutoUpdatePossible)|raw }})</span> {% endif %} {% elseif plugin.isInstalled %} diff --git a/plugins/Marketplace/tests/UI/Marketplace_spec.js b/plugins/Marketplace/tests/UI/Marketplace_spec.js index de38c7f32d..6557a7ac8b 100644 --- a/plugins/Marketplace/tests/UI/Marketplace_spec.js +++ b/plugins/Marketplace/tests/UI/Marketplace_spec.js @@ -25,7 +25,7 @@ describe("Marketplace", function () { async function loadPluginDetailPage(pluginName, isFreePlugin) { await page.goto(isFreePlugin ? pluginsUrl : paidPluginsUrl); - const elem = await page.waitForSelector('.card-title [piwik-plugin-name="' + pluginName + '"]'); + const elem = await page.waitForSelector('.card-title [vue-directive="Marketplace.PluginName"][vue-directive-value*="' + pluginName + '"]'); await elem.click(); await page.waitForNetworkIdle(); await page.waitForSelector('.ui-dialog .pluginDetails'); diff --git a/plugins/Marketplace/vue/dist/Marketplace.umd.js b/plugins/Marketplace/vue/dist/Marketplace.umd.js index 10b2c36c49..b311896acf 100644 --- a/plugins/Marketplace/vue/dist/Marketplace.umd.js +++ b/plugins/Marketplace/vue/dist/Marketplace.umd.js @@ -125,7 +125,9 @@ module.exports = __WEBPACK_EXTERNAL_MODULE_a5a2__; __webpack_require__.r(__webpack_exports__); // EXPORTS +__webpack_require__.d(__webpack_exports__, "Marketplace", function() { return /* reexport */ Marketplace; }); __webpack_require__.d(__webpack_exports__, "LicenseKey", function() { return /* reexport */ LicenseKey; }); +__webpack_require__.d(__webpack_exports__, "PluginName", function() { return /* reexport */ PluginName; }); // CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/setPublicPath.js // This file is imported into lib/wc client bundles. @@ -143,25 +145,364 @@ if (typeof window !== 'undefined') { // Indicate to webpack that this file can be concatenated /* harmony default export */ var setPublicPath = (null); +// CONCATENATED MODULE: ./plugins/Marketplace/vue/src/PluginName/PluginName.ts +/*! + * Matomo - free/libre analytics platform + * + * @link https://matomo.org + * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later + */ +window.broadcast.addPopoverHandler('browsePluginDetail', function (value) { + var pluginName = value; + var activeTab = null; + + if (value.indexOf('!') !== -1) { + activeTab = value.substr(value.indexOf('!') + 1); + pluginName = value.substr(0, value.indexOf('!')); + } + + var url = "module=Marketplace&action=pluginDetails&pluginName=".concat(encodeURIComponent(pluginName)); + + if (activeTab) { + url += "&activeTab=".concat(encodeURIComponent(activeTab)); + } + + window.Piwik_Popover.createPopupAndLoadUrl(url, 'details'); +}); + +function onClickPluginNameLink(binding, event) { + var pluginName = binding.value.pluginName; + var activePluginTab = binding.value.activePluginTab; + event.preventDefault(); + + if (activePluginTab) { + pluginName += "!".concat(activePluginTab); + } + + window.broadcast.propagateNewPopoverParameter('browsePluginDetail', pluginName); +} + +var _window = window, + $ = _window.$; +/* harmony default export */ var PluginName = ({ + mounted: function mounted(element, binding) { + var pluginName = binding.value.pluginName; + + if (!pluginName) { + return; + } + + binding.value.onClickHandler = onClickPluginNameLink.bind(null, binding); + $(element).on('click', binding.value.onClickHandler); + }, + unmounted: function unmounted(element, binding) { + $(element).off('click', binding.value.onClickHandler); + } +}); +// CONCATENATED MODULE: ./plugins/Marketplace/vue/src/PluginName/PluginName.adapter.ts +/*! + * Matomo - free/libre analytics platform + * + * @link https://matomo.org + * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later + */ + + +function piwikPluginName() { + return { + restrict: 'A', + link: function link(scope, element, attrs) { + var binding = { + instance: null, + value: { + pluginName: attrs.piwikPluginName, + activePluginTab: attrs.activeplugintab + }, + oldValue: null, + modifiers: {}, + dir: {} + }; + PluginName.mounted(element[0], binding); + element.on('$destroy', function () { + PluginName.unmounted(element[0], binding); + }); + } + }; +} + +window.angular.module('piwikApp').directive('piwikPluginName', piwikPluginName); // EXTERNAL MODULE: external {"commonjs":"vue","commonjs2":"vue","root":"Vue"} var external_commonjs_vue_commonjs2_vue_root_Vue_ = __webpack_require__("8bbf"); -// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/Marketplace/vue/src/LicenseKey/LicenseKey.vue?vue&type=template&id=391f4838 +// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/Marketplace/vue/src/Marketplace/Marketplace.vue?vue&type=template&id=210cda1c var _hoisted_1 = { - class: "marketplace-max-width" + class: "row marketplaceActions", + ref: "root" }; var _hoisted_2 = { - class: "marketplace-paid-intro" + class: "col s12 m6 l4" }; var _hoisted_3 = { - key: 0 + class: "col s12 m6 l4" }; var _hoisted_4 = { + key: 0, + class: "col s12 m12 l4 " +}; +var _hoisted_5 = ["action"]; +function render(_ctx, _cache, $props, $setup, $data, $options) { + var _component_Field = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("Field"); + + return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", _hoisted_1, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", _hoisted_2, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_Field, { + uicontrol: "select", + name: "plugin_type", + "model-value": _ctx.pluginTypeFilter, + "onUpdate:modelValue": _cache[0] || (_cache[0] = function ($event) { + _ctx.pluginTypeFilter = $event; + + _ctx.changePluginType(); + }), + title: _ctx.translate('Marketplace_Show'), + "full-width": true, + options: _ctx.pluginTypeOptions + }, null, 8, ["model-value", "title", "options"])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", _hoisted_3, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_Field, { + uicontrol: "select", + name: "plugin_sort", + "model-value": _ctx.pluginSort, + "onUpdate:modelValue": _cache[1] || (_cache[1] = function ($event) { + _ctx.pluginSort = $event; + + _ctx.changePluginSort(); + }), + title: _ctx.translate('Marketplace_Sort'), + "full-width": true, + options: _ctx.pluginSortOptions + }, null, 8, ["model-value", "title", "options"])]), _ctx.pluginsToShow.length > 20 || _ctx.query ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", _hoisted_4, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("form", { + method: "post", + class: "plugin-search", + action: _ctx.pluginSearchFormAction, + ref: "pluginSearchForm" + }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_Field, { + uicontrol: "text", + name: "query", + title: _ctx.queryInputTitle, + "full-width": true, + modelValue: _ctx.searchQuery, + "onUpdate:modelValue": _cache[2] || (_cache[2] = function ($event) { + return _ctx.searchQuery = $event; + }) + }, null, 8, ["title", "modelValue"])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", { + class: "icon-search", + onClick: _cache[3] || (_cache[3] = function ($event) { + return _ctx.$refs.pluginSearchForm.submit(); + }) + })], 8, _hoisted_5)])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)], 512); +} +// CONCATENATED MODULE: ./plugins/Marketplace/vue/src/Marketplace/Marketplace.vue?vue&type=template&id=210cda1c + +// EXTERNAL MODULE: external "CoreHome" +var external_CoreHome_ = __webpack_require__("19dc"); + +// EXTERNAL MODULE: external "CorePluginsAdmin" +var external_CorePluginsAdmin_ = __webpack_require__("a5a2"); + +// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-typescript/node_modules/cache-loader/dist/cjs.js??ref--14-0!./node_modules/babel-loader/lib!./node_modules/@vue/cli-plugin-typescript/node_modules/ts-loader??ref--14-2!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/Marketplace/vue/src/Marketplace/Marketplace.vue?vue&type=script&lang=ts + + + + +var lcfirst = function lcfirst(s) { + return "".concat(s[0].toLowerCase()).concat(s.substring(1)); +}; + +var Marketplacevue_type_script_lang_ts_window = window, + Marketplacevue_type_script_lang_ts_$ = Marketplacevue_type_script_lang_ts_window.$; +/* harmony default export */ var Marketplacevue_type_script_lang_ts = (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["defineComponent"])({ + props: { + pluginType: { + type: String, + required: true + }, + pluginTypeOptions: { + type: [Object, Array], + required: true + }, + sort: { + type: String, + required: true + }, + pluginSortOptions: { + type: [Object, Array], + required: true + }, + pluginsToShow: { + type: Array, + required: true + }, + query: { + type: String, + default: '' + }, + numAvailablePlugins: { + type: Number, + required: true + } + }, + components: { + Field: external_CorePluginsAdmin_["Field"] + }, + data: function data() { + return { + pluginSort: this.sort, + pluginTypeFilter: this.pluginType, + searchQuery: this.query + }; + }, + created: function created() { + function syncMaxHeight2(selector) { + if (!selector) { + return; + } + + var $nodes = Marketplacevue_type_script_lang_ts_$(selector); + + if (!$nodes || !$nodes.length) { + return; + } + + var maxh3 = undefined; + var maxMeta = undefined; + var maxFooter = undefined; + var nodesToUpdate = []; + var lastTop = 0; + $nodes.each(function (index, node) { + var $node = Marketplacevue_type_script_lang_ts_$(node); + + var _$node$offset = $node.offset(), + top = _$node$offset.top; + + if (lastTop !== top) { + nodesToUpdate = []; + lastTop = top; + maxh3 = undefined; + maxMeta = undefined; + maxFooter = undefined; + } + + nodesToUpdate.push($node); + var heightH3 = $node.find('h3').height(); + var heightMeta = $node.find('.metadata').height(); + var heightFooter = $node.find('.footer').height(); + + if (!maxh3) { + maxh3 = heightH3; + } else if (maxh3 < heightH3) { + maxh3 = heightH3; + } + + if (!maxMeta) { + maxMeta = heightMeta; + } else if (maxMeta < heightMeta) { + maxMeta = heightMeta; + } + + if (!maxFooter) { + maxFooter = heightFooter; + } else if (maxFooter < heightFooter) { + maxFooter = heightFooter; + } + + Marketplacevue_type_script_lang_ts_$.each(nodesToUpdate, function (i, $nodeToUpdate) { + if (maxh3) { + $nodeToUpdate.find('h3').height("".concat(maxh3, "px")); + } + + if (maxMeta) { + $nodeToUpdate.find('.metadata').height("".concat(maxMeta, "px")); + } + + if (maxFooter) { + $nodeToUpdate.find('.footer').height("".concat(maxFooter, "px")); + } + }); + }); + } + + Object(external_commonjs_vue_commonjs2_vue_root_Vue_["nextTick"])(function () { + // Keeps the plugin descriptions the same height + var descriptions = Marketplacevue_type_script_lang_ts_$('.marketplace .plugin .description'); + descriptions.dotdotdot({ + after: 'a.more', + watch: 'window' + }); + external_CoreHome_["Matomo"].helper.compileVueDirectives(descriptions); // have to recompile any vue directives + + syncMaxHeight2('.marketplace .plugin'); + }); + }, + methods: { + changePluginSort: function changePluginSort() { + external_CoreHome_["MatomoUrl"].updateUrl(Object.assign(Object.assign({}, external_CoreHome_["MatomoUrl"].urlParsed.value), {}, { + query: '', + sort: this.pluginSort + }), Object.assign(Object.assign({}, external_CoreHome_["MatomoUrl"].hashParsed.value), {}, { + query: '', + sort: this.pluginSort + })); + }, + changePluginType: function changePluginType() { + external_CoreHome_["MatomoUrl"].updateUrl(Object.assign(Object.assign({}, external_CoreHome_["MatomoUrl"].urlParsed.value), {}, { + query: '', + show: this.pluginTypeFilter + }), Object.assign(Object.assign({}, external_CoreHome_["MatomoUrl"].hashParsed.value), {}, { + query: '', + show: this.pluginTypeFilter + })); + } + }, + computed: { + pluginSearchFormAction: function pluginSearchFormAction() { + return "?".concat(external_CoreHome_["MatomoUrl"].stringify(Object.assign(Object.assign({}, external_CoreHome_["MatomoUrl"].urlParsed.value), {}, { + sort: '', + embed: '0' + })), "#?").concat(external_CoreHome_["MatomoUrl"].stringify(Object.assign(Object.assign({}, external_CoreHome_["MatomoUrl"].hashParsed.value), {}, { + sort: '', + embed: '0', + query: this.searchQuery + }))); + }, + queryInputTitle: function queryInputTitle() { + var plugins = lcfirst(Object(external_CoreHome_["translate"])('General_Plugins')); + return "".concat(Object(external_CoreHome_["translate"])('General_Search'), " ").concat(this.numAvailablePlugins, " ").concat(plugins, "..."); + } + } +})); +// CONCATENATED MODULE: ./plugins/Marketplace/vue/src/Marketplace/Marketplace.vue?vue&type=script&lang=ts + +// CONCATENATED MODULE: ./plugins/Marketplace/vue/src/Marketplace/Marketplace.vue + + + +Marketplacevue_type_script_lang_ts.render = render + +/* harmony default export */ var Marketplace = (Marketplacevue_type_script_lang_ts); +// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/Marketplace/vue/src/LicenseKey/LicenseKey.vue?vue&type=template&id=9372136c + +var LicenseKeyvue_type_template_id_9372136c_hoisted_1 = { + class: "marketplace-max-width" +}; +var LicenseKeyvue_type_template_id_9372136c_hoisted_2 = { + class: "marketplace-paid-intro" +}; +var LicenseKeyvue_type_template_id_9372136c_hoisted_3 = { + key: 0 +}; +var LicenseKeyvue_type_template_id_9372136c_hoisted_4 = { key: 0 }; -var _hoisted_5 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1); +var LicenseKeyvue_type_template_id_9372136c_hoisted_5 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1); var _hoisted_6 = { class: "licenseToolbar valign-wrapper" @@ -171,52 +512,49 @@ var _hoisted_8 = { key: 0 }; var _hoisted_9 = { - href: "javascript:;", - class: "btn installAllPaidPlugins valign" -}; -var _hoisted_10 = { class: "ui-confirm", - id: "installAllPaidPluginsAtOnce" + id: "installAllPaidPluginsAtOnce", + ref: "installAllPaidPluginsAtOnce" }; -var _hoisted_11 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1); +var _hoisted_10 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1); -var _hoisted_12 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1); +var _hoisted_11 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1); -var _hoisted_13 = ["data-href", "value"]; -var _hoisted_14 = ["value"]; -var _hoisted_15 = { +var _hoisted_12 = ["data-href", "value"]; +var _hoisted_13 = ["value"]; +var _hoisted_14 = { key: 1 }; -var _hoisted_16 = { +var _hoisted_15 = { key: 0 }; -var _hoisted_17 = ["innerHTML"]; +var _hoisted_16 = ["innerHTML"]; -var _hoisted_18 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1); +var _hoisted_17 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("br", null, null, -1); -var _hoisted_19 = { +var _hoisted_18 = { class: "licenseToolbar valign-wrapper" }; -var _hoisted_20 = { +var _hoisted_19 = { key: 1 }; -var _hoisted_21 = ["innerHTML"]; -var _hoisted_22 = { +var _hoisted_20 = ["innerHTML"]; +var _hoisted_21 = { class: "ui-confirm", id: "confirmRemoveLicense", ref: "confirmRemoveLicense" }; +var _hoisted_22 = ["value"]; var _hoisted_23 = ["value"]; -var _hoisted_24 = ["value"]; -function render(_ctx, _cache, $props, $setup, $data, $options) { +function LicenseKeyvue_type_template_id_9372136c_render(_ctx, _cache, $props, $setup, $data, $options) { var _component_DefaultLicenseKeyFields = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("DefaultLicenseKeyFields"); var _component_SaveButton = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("SaveButton"); var _component_ActivityIndicator = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ActivityIndicator"); - return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", _hoisted_1, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", _hoisted_2, [_ctx.isValidConsumer ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", _hoisted_3, [_ctx.isSuperUser ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", _hoisted_4, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('Marketplace_PaidPluginsWithLicenseKeyIntro', '')) + " ", 1), _hoisted_5, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", _hoisted_6, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_DefaultLicenseKeyFields, { + return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", LicenseKeyvue_type_template_id_9372136c_hoisted_1, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", LicenseKeyvue_type_template_id_9372136c_hoisted_2, [_ctx.isValidConsumer ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", LicenseKeyvue_type_template_id_9372136c_hoisted_3, [_ctx.isSuperUser ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", LicenseKeyvue_type_template_id_9372136c_hoisted_4, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('Marketplace_PaidPluginsWithLicenseKeyIntro', '')) + " ", 1), LicenseKeyvue_type_template_id_9372136c_hoisted_5, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", _hoisted_6, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_DefaultLicenseKeyFields, { "model-value": _ctx.licenseKey, "onUpdate:modelValue": _cache[0] || (_cache[0] = function ($event) { _ctx.licenseKey = $event; @@ -239,7 +577,13 @@ function render(_ctx, _cache, $props, $setup, $data, $options) { }, null, 8, ["value"]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", { class: "btn valign", href: _ctx.subscriptionOverviewLink - }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('Marketplace_ViewSubscriptions')), 9, _hoisted_7), _ctx.showInstallAllPaidPlugins ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", _hoisted_8, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", _hoisted_9, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('Marketplace_InstallPurchasedPlugins')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", _hoisted_10, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('Marketplace_InstallAllPurchasedPlugins')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('Marketplace_InstallThesePlugins')) + " ", 1), _hoisted_11, _hoisted_12]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("ul", null, [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(_ctx.paidPluginsToInstallAtOnce, function (pluginName) { + }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('Marketplace_ViewSubscriptions')), 9, _hoisted_7), _ctx.showInstallAllPaidPlugins ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", _hoisted_8, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", { + href: "", + class: "btn installAllPaidPlugins valign", + onClick: _cache[3] || (_cache[3] = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withModifiers"])(function ($event) { + return _ctx.onInstallAllPaidPlugins(); + }, ["prevent"])) + }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('Marketplace_InstallPurchasedPlugins')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", _hoisted_9, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('Marketplace_InstallAllPurchasedPlugins')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("p", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('Marketplace_InstallThesePlugins')) + " ", 1), _hoisted_10, _hoisted_11]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("ul", null, [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(_ctx.paidPluginsToInstallAtOnce, function (pluginName) { return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("li", { key: pluginName }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(pluginName), 1); @@ -248,22 +592,22 @@ function render(_ctx, _cache, $props, $setup, $data, $options) { type: "button", "data-href": _ctx.installAllPaidPluginsLink, value: _ctx.translate('Marketplace_InstallAllPurchasedPluginsAction', _ctx.paidPluginsToInstallAtOnce.length) - }, null, 8, _hoisted_13), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", { + }, null, 8, _hoisted_12), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", { role: "cancel", type: "button", value: _ctx.translate('General_Cancel') - }, null, 8, _hoisted_14)])])])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ActivityIndicator, { + }, null, 8, _hoisted_13)])], 512)])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ActivityIndicator, { loading: _ctx.isUpdating - }, null, 8, ["loading"])])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])) : (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", _hoisted_15, [_ctx.isSuperUser ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", _hoisted_16, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", { + }, null, 8, ["loading"])])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])) : (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", _hoisted_14, [_ctx.isSuperUser ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", _hoisted_15, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", { innerHTML: _ctx.$sanitize(_ctx.noLicenseKeyIntroText) - }, null, 8, _hoisted_17), _hoisted_18, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", _hoisted_19, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_DefaultLicenseKeyFields, { + }, null, 8, _hoisted_16), _hoisted_17, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", _hoisted_18, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_DefaultLicenseKeyFields, { "model-value": _ctx.licenseKey, - "onUpdate:modelValue": _cache[3] || (_cache[3] = function ($event) { + "onUpdate:modelValue": _cache[4] || (_cache[4] = function ($event) { _ctx.licenseKey = $event; _ctx.updatedLicenseKey(); }), - onConfirm: _cache[4] || (_cache[4] = function ($event) { + onConfirm: _cache[5] || (_cache[5] = function ($event) { return _ctx.updateLicense(); }), "has-license-key": _ctx.hasLicenseKey, @@ -271,25 +615,19 @@ function render(_ctx, _cache, $props, $setup, $data, $options) { "enable-update": _ctx.enableUpdate }, null, 8, ["model-value", "has-license-key", "is-valid-consumer", "enable-update"])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ActivityIndicator, { loading: _ctx.isUpdating - }, null, 8, ["loading"])])) : (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", _hoisted_20, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", { + }, null, 8, ["loading"])])) : (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", _hoisted_19, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", { innerHTML: _ctx.$sanitize(_ctx.noLicenseKeyIntroNoSuperUserAccessText) - }, null, 8, _hoisted_21)]))]))]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", _hoisted_22, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('Marketplace_ConfirmRemoveLicense')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", { + }, null, 8, _hoisted_20)]))]))]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", _hoisted_21, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('Marketplace_ConfirmRemoveLicense')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", { role: "yes", type: "button", value: _ctx.translate('General_Yes') - }, null, 8, _hoisted_23), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", { + }, null, 8, _hoisted_22), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", { role: "no", type: "button", value: _ctx.translate('General_No') - }, null, 8, _hoisted_24)], 512)]); + }, null, 8, _hoisted_23)], 512)]); } -// CONCATENATED MODULE: ./plugins/Marketplace/vue/src/LicenseKey/LicenseKey.vue?vue&type=template&id=391f4838 - -// EXTERNAL MODULE: external "CoreHome" -var external_CoreHome_ = __webpack_require__("19dc"); - -// EXTERNAL MODULE: external "CorePluginsAdmin" -var external_CorePluginsAdmin_ = __webpack_require__("a5a2"); +// CONCATENATED MODULE: ./plugins/Marketplace/vue/src/LicenseKey/LicenseKey.vue?vue&type=template&id=9372136c // CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/Marketplace/vue/src/LicenseKey/DefaultLicenseKeyFields.vue?vue&type=template&id=26188382 @@ -390,6 +728,9 @@ DefaultLicenseKeyFieldsvue_type_script_lang_ts.render = DefaultLicenseKeyFieldsv }; }, methods: { + onInstallAllPaidPlugins: function onInstallAllPaidPlugins() { + external_CoreHome_["Matomo"].helper.modalConfirm(this.$refs.installAllPaidPluginsAtOnce); + }, updateLicenseKey: function updateLicenseKey(action, licenseKey, onSuccessMessage) { var _this = this; @@ -466,7 +807,7 @@ DefaultLicenseKeyFieldsvue_type_script_lang_ts.render = DefaultLicenseKeyFieldsv -LicenseKeyvue_type_script_lang_ts.render = render +LicenseKeyvue_type_script_lang_ts.render = LicenseKeyvue_type_template_id_9372136c_render /* harmony default export */ var LicenseKey = (LicenseKeyvue_type_script_lang_ts); // CONCATENATED MODULE: ./plugins/Marketplace/vue/src/index.ts @@ -477,6 +818,9 @@ LicenseKeyvue_type_script_lang_ts.render = render * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later */ + + + // CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/entry-lib-no-default.js diff --git a/plugins/Marketplace/vue/dist/Marketplace.umd.min.js b/plugins/Marketplace/vue/dist/Marketplace.umd.min.js index 52c95a96e3..0d582d3964 100644 --- a/plugins/Marketplace/vue/dist/Marketplace.umd.min.js +++ b/plugins/Marketplace/vue/dist/Marketplace.umd.min.js @@ -1,4 +1,18 @@ -(function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t(require("CoreHome"),require("vue"),require("CorePluginsAdmin")):"function"===typeof define&&define.amd?define(["CoreHome",,"CorePluginsAdmin"],t):"object"===typeof exports?exports["Marketplace"]=t(require("CoreHome"),require("vue"),require("CorePluginsAdmin")):e["Marketplace"]=t(e["CoreHome"],e["Vue"],e["CorePluginsAdmin"])})("undefined"!==typeof self?self:this,(function(e,t,n){return function(e){var t={};function n(l){if(t[l])return t[l].exports;var a=t[l]={i:l,l:!1,exports:{}};return e[l].call(a.exports,a,a.exports,n),a.l=!0,a.exports}return n.m=e,n.c=t,n.d=function(e,t,l){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:l})},n.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var l=Object.create(null);if(n.r(l),Object.defineProperty(l,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var a in e)n.d(l,a,function(t){return e[t]}.bind(null,a));return l},n.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="plugins/Marketplace/vue/dist/",n(n.s="fae3")}({"19dc":function(t,n){t.exports=e},"8bbf":function(e,n){e.exports=t},a5a2:function(e,t){e.exports=n},fae3:function(e,t,n){"use strict";if(n.r(t),n.d(t,"LicenseKey",(function(){return I})),"undefined"!==typeof window){var l=window.document.currentScript,a=l&&l.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);a&&(n.p=a[1])}var i=n("8bbf"),o={class:"marketplace-max-width"},r={class:"marketplace-paid-intro"},c={key:0},s={key:0},u=Object(i["createElementVNode"])("br",null,null,-1),d={class:"licenseToolbar valign-wrapper"},p=["href"],m={key:0},b={href:"javascript:;",class:"btn installAllPaidPlugins valign"},f={class:"ui-confirm",id:"installAllPaidPluginsAtOnce"},v=Object(i["createElementVNode"])("br",null,null,-1),O=Object(i["createElementVNode"])("br",null,null,-1),y=["data-href","value"],j=["value"],g={key:1},h={key:0},k=["innerHTML"],V=Object(i["createElementVNode"])("br",null,null,-1),P={class:"licenseToolbar valign-wrapper"},L={key:1},N=["innerHTML"],K={class:"ui-confirm",id:"confirmRemoveLicense",ref:"confirmRemoveLicense"},B=["value"],E=["value"];function A(e,t,n,l,a,A){var M=Object(i["resolveComponent"])("DefaultLicenseKeyFields"),S=Object(i["resolveComponent"])("SaveButton"),U=Object(i["resolveComponent"])("ActivityIndicator");return Object(i["openBlock"])(),Object(i["createElementBlock"])("div",o,[Object(i["createElementVNode"])("div",r,[e.isValidConsumer?(Object(i["openBlock"])(),Object(i["createElementBlock"])("div",c,[e.isSuperUser?(Object(i["openBlock"])(),Object(i["createElementBlock"])("div",s,[Object(i["createTextVNode"])(Object(i["toDisplayString"])(e.translate("Marketplace_PaidPluginsWithLicenseKeyIntro",""))+" ",1),u,Object(i["createElementVNode"])("div",d,[Object(i["createVNode"])(M,{"model-value":e.licenseKey,"onUpdate:modelValue":t[0]||(t[0]=function(t){e.licenseKey=t,e.updatedLicenseKey()}),onConfirm:t[1]||(t[1]=function(t){return e.updateLicense()}),"has-license-key":e.hasLicenseKey,"is-valid-consumer":e.isValidConsumer,"enable-update":e.enableUpdate},null,8,["model-value","has-license-key","is-valid-consumer","enable-update"]),Object(i["createVNode"])(S,{class:"valign",id:"remove_license_key",onConfirm:t[2]||(t[2]=function(t){return e.removeLicense()}),value:e.translate("Marketplace_RemoveLicenseKey")},null,8,["value"]),Object(i["createElementVNode"])("a",{class:"btn valign",href:e.subscriptionOverviewLink},Object(i["toDisplayString"])(e.translate("Marketplace_ViewSubscriptions")),9,p),e.showInstallAllPaidPlugins?(Object(i["openBlock"])(),Object(i["createElementBlock"])("div",m,[Object(i["createElementVNode"])("a",b,Object(i["toDisplayString"])(e.translate("Marketplace_InstallPurchasedPlugins")),1),Object(i["createElementVNode"])("div",f,[Object(i["createElementVNode"])("h2",null,Object(i["toDisplayString"])(e.translate("Marketplace_InstallAllPurchasedPlugins")),1),Object(i["createElementVNode"])("p",null,[Object(i["createTextVNode"])(Object(i["toDisplayString"])(e.translate("Marketplace_InstallThesePlugins"))+" ",1),v,O]),Object(i["createElementVNode"])("ul",null,[(Object(i["openBlock"])(!0),Object(i["createElementBlock"])(i["Fragment"],null,Object(i["renderList"])(e.paidPluginsToInstallAtOnce,(function(e){return Object(i["openBlock"])(),Object(i["createElementBlock"])("li",{key:e},Object(i["toDisplayString"])(e),1)})),128))]),Object(i["createElementVNode"])("p",null,[Object(i["createElementVNode"])("input",{role:"install",type:"button","data-href":e.installAllPaidPluginsLink,value:e.translate("Marketplace_InstallAllPurchasedPluginsAction",e.paidPluginsToInstallAtOnce.length)},null,8,y),Object(i["createElementVNode"])("input",{role:"cancel",type:"button",value:e.translate("General_Cancel")},null,8,j)])])])):Object(i["createCommentVNode"])("",!0)]),Object(i["createVNode"])(U,{loading:e.isUpdating},null,8,["loading"])])):Object(i["createCommentVNode"])("",!0)])):(Object(i["openBlock"])(),Object(i["createElementBlock"])("div",g,[e.isSuperUser?(Object(i["openBlock"])(),Object(i["createElementBlock"])("div",h,[Object(i["createElementVNode"])("span",{innerHTML:e.$sanitize(e.noLicenseKeyIntroText)},null,8,k),V,Object(i["createElementVNode"])("div",P,[Object(i["createVNode"])(M,{"model-value":e.licenseKey,"onUpdate:modelValue":t[3]||(t[3]=function(t){e.licenseKey=t,e.updatedLicenseKey()}),onConfirm:t[4]||(t[4]=function(t){return e.updateLicense()}),"has-license-key":e.hasLicenseKey,"is-valid-consumer":e.isValidConsumer,"enable-update":e.enableUpdate},null,8,["model-value","has-license-key","is-valid-consumer","enable-update"])]),Object(i["createVNode"])(U,{loading:e.isUpdating},null,8,["loading"])])):(Object(i["openBlock"])(),Object(i["createElementBlock"])("div",L,[Object(i["createElementVNode"])("span",{innerHTML:e.$sanitize(e.noLicenseKeyIntroNoSuperUserAccessText)},null,8,N)]))]))]),Object(i["createElementVNode"])("div",K,[Object(i["createElementVNode"])("h2",null,Object(i["toDisplayString"])(e.translate("Marketplace_ConfirmRemoveLicense")),1),Object(i["createElementVNode"])("input",{role:"yes",type:"button",value:e.translate("General_Yes")},null,8,B),Object(i["createElementVNode"])("input",{role:"no",type:"button",value:e.translate("General_No")},null,8,E)],512)])}var M=n("19dc"),S=n("a5a2"),U={class:"valign licenseKeyText"};function _(e,t,n,l,a,o){var r=Object(i["resolveComponent"])("Field"),c=Object(i["resolveComponent"])("SaveButton");return Object(i["openBlock"])(),Object(i["createElementBlock"])(i["Fragment"],null,[Object(i["createElementVNode"])("div",U,[Object(i["createVNode"])(r,{uicontrol:"text",name:"license_key","full-width":!0,"model-value":e.modelValue,"onUpdate:modelValue":t[0]||(t[0]=function(t){return e.$emit("update:modelValue",t)}),placeholder:e.licenseKeyPlaceholder},null,8,["model-value","placeholder"])]),Object(i["createVNode"])(c,{class:"valign",onConfirm:t[1]||(t[1]=function(t){return e.$emit("confirm")}),disabled:!e.enableUpdate,value:e.saveButtonText,id:"submit_license_key"},null,8,["disabled","value"])],64)}var C=Object(i["defineComponent"])({props:{modelValue:String,isValidConsumer:Boolean,hasLicenseKey:Boolean,enableUpdate:Boolean},emits:["update:modelValue","confirm"],components:{Field:S["Field"],SaveButton:S["SaveButton"]},computed:{licenseKeyPlaceholder:function(){return this.isValidConsumer?Object(M["translate"])("Marketplace_LicenseKeyIsValidShort"):Object(M["translate"])("Marketplace_LicenseKey")},saveButtonText:function(){return this.hasLicenseKey?Object(M["translate"])("CoreUpdater_UpdateTitle"):Object(M["translate"])("Marketplace_ActivateLicenseKey")}}});C.render=_;var x=C,T=Object(i["defineComponent"])({props:{isValidConsumer:Boolean,isSuperUser:Boolean,isAutoUpdatePossible:Boolean,isPluginsAdminEnabled:Boolean,hasLicenseKey:Boolean,paidPluginsToInstallAtOnce:{type:Array,required:!0},installNonce:{type:String,required:!0}},components:{SaveButton:S["SaveButton"],ActivityIndicator:M["ActivityIndicator"],DefaultLicenseKeyFields:x},data:function(){return{licenseKey:"",enableUpdate:!1,isUpdating:!1}},methods:{updateLicenseKey:function(e,t,n){var l=this;M["AjaxHelper"].post({module:"API",method:"Marketplace.".concat(e),format:"JSON"},{licenseKey:this.licenseKey},{withTokenInUrl:!0}).then((function(e){l.isUpdating=!1,e&&e.value&&(M["NotificationsStore"].show({message:n,context:"success",type:"transient"}),M["Matomo"].helper.redirect())}),(function(){l.isUpdating=!1}))},removeLicense:function(){var e=this;M["Matomo"].helper.modalConfirm(this.$refs.confirmRemoveLicense,{yes:function(){e.enableUpdate=!1,e.isUpdating=!0,e.updateLicenseKey("deleteLicenseKey","",Object(M["translate"])("Marketplace_LicenseKeyDeletedSuccess"))}})},updatedLicenseKey:function(){this.enableUpdate=!!this.licenseKey},updateLicense:function(){this.enableUpdate=!1,this.isUpdating=!0,this.updateLicenseKey("saveLicenseKey",this.licenseKey,Object(M["translate"])("Marketplace_LicenseKeyActivatedSuccess"))}},computed:{subscriptionOverviewLink:function(){return"?".concat(M["MatomoUrl"].stringify(Object.assign(Object.assign({},M["MatomoUrl"].urlParsed.value),{},{action:"subscriptionOverview"})))},noLicenseKeyIntroText:function(){return Object(M["translate"])("Marketplace_PaidPluginsNoLicenseKeyIntro",'<a target="_blank" rel="noreferrer noopener" href="https://matomo.org/recommends/premium-plugins/">',"</a>")},noLicenseKeyIntroNoSuperUserAccessText:function(){return Object(M["translate"])("Marketplace_PaidPluginsNoLicenseKeyIntroNoSuperUserAccess",'<a target="_blank" rel="noreferrer noopener" href="https://matomo.org/recommends/premium-plugins/">',"</a>")},installAllPaidPluginsLink:function(){return"?".concat(M["MatomoUrl"].stringify(Object.assign(Object.assign({},M["MatomoUrl"].urlParsed.value),{},{action:"installAllPaidPlugins",nonce:this.installNonce})))},showInstallAllPaidPlugins:function(){return this.isAutoUpdatePossible&&this.isPluginsAdminEnabled&&this.paidPluginsToInstallAtOnce.length}}});T.render=A;var I=T; +(function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t(require("CoreHome"),require("vue"),require("CorePluginsAdmin")):"function"===typeof define&&define.amd?define(["CoreHome",,"CorePluginsAdmin"],t):"object"===typeof exports?exports["Marketplace"]=t(require("CoreHome"),require("vue"),require("CorePluginsAdmin")):e["Marketplace"]=t(e["CoreHome"],e["Vue"],e["CorePluginsAdmin"])})("undefined"!==typeof self?self:this,(function(e,t,n){return function(e){var t={};function n(l){if(t[l])return t[l].exports;var a=t[l]={i:l,l:!1,exports:{}};return e[l].call(a.exports,a,a.exports,n),a.l=!0,a.exports}return n.m=e,n.c=t,n.d=function(e,t,l){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:l})},n.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var l=Object.create(null);if(n.r(l),Object.defineProperty(l,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var a in e)n.d(l,a,function(t){return e[t]}.bind(null,a));return l},n.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="plugins/Marketplace/vue/dist/",n(n.s="fae3")}({"19dc":function(t,n){t.exports=e},"8bbf":function(e,n){e.exports=t},a5a2:function(e,t){e.exports=n},fae3:function(e,t,n){"use strict";if(n.r(t),n.d(t,"Marketplace",(function(){return P})),n.d(t,"LicenseKey",(function(){return Z})),n.d(t,"PluginName",(function(){return c})),"undefined"!==typeof window){var l=window.document.currentScript,a=l&&l.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);a&&(n.p=a[1])}function i(e,t){var n=e.value.pluginName,l=e.value.activePluginTab;t.preventDefault(),l&&(n+="!".concat(l)),window.broadcast.propagateNewPopoverParameter("browsePluginDetail",n)} +/*! + * Matomo - free/libre analytics platform + * + * @link https://matomo.org + * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later + */ +window.broadcast.addPopoverHandler("browsePluginDetail",(function(e){var t=e,n=null;-1!==e.indexOf("!")&&(n=e.substr(e.indexOf("!")+1),t=e.substr(0,e.indexOf("!")));var l="module=Marketplace&action=pluginDetails&pluginName=".concat(encodeURIComponent(t));n&&(l+="&activeTab=".concat(encodeURIComponent(n))),window.Piwik_Popover.createPopupAndLoadUrl(l,"details")}));var o=window,r=o.$,c={mounted:function(e,t){var n=t.value.pluginName;n&&(t.value.onClickHandler=i.bind(null,t),r(e).on("click",t.value.onClickHandler))},unmounted:function(e,t){r(e).off("click",t.value.onClickHandler)}}; +/*! + * Matomo - free/libre analytics platform + * + * @link https://matomo.org + * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later + */ +function s(){return{restrict:"A",link:function(e,t,n){var l={instance:null,value:{pluginName:n.piwikPluginName,activePluginTab:n.activeplugintab},oldValue:null,modifiers:{},dir:{}};c.mounted(t[0],l),t.on("$destroy",(function(){c.unmounted(t[0],l)}))}}}window.angular.module("piwikApp").directive("piwikPluginName",s);var u=n("8bbf"),d={class:"row marketplaceActions",ref:"root"},p={class:"col s12 m6 l4"},m={class:"col s12 m6 l4"},b={key:0,class:"col s12 m12 l4 "},f=["action"];function g(e,t,n,l,a,i){var o=Object(u["resolveComponent"])("Field");return Object(u["openBlock"])(),Object(u["createElementBlock"])("div",d,[Object(u["createElementVNode"])("div",p,[Object(u["createVNode"])(o,{uicontrol:"select",name:"plugin_type","model-value":e.pluginTypeFilter,"onUpdate:modelValue":t[0]||(t[0]=function(t){e.pluginTypeFilter=t,e.changePluginType()}),title:e.translate("Marketplace_Show"),"full-width":!0,options:e.pluginTypeOptions},null,8,["model-value","title","options"])]),Object(u["createElementVNode"])("div",m,[Object(u["createVNode"])(o,{uicontrol:"select",name:"plugin_sort","model-value":e.pluginSort,"onUpdate:modelValue":t[1]||(t[1]=function(t){e.pluginSort=t,e.changePluginSort()}),title:e.translate("Marketplace_Sort"),"full-width":!0,options:e.pluginSortOptions},null,8,["model-value","title","options"])]),e.pluginsToShow.length>20||e.query?(Object(u["openBlock"])(),Object(u["createElementBlock"])("div",b,[Object(u["createElementVNode"])("form",{method:"post",class:"plugin-search",action:e.pluginSearchFormAction,ref:"pluginSearchForm"},[Object(u["createElementVNode"])("div",null,[Object(u["createVNode"])(o,{uicontrol:"text",name:"query",title:e.queryInputTitle,"full-width":!0,modelValue:e.searchQuery,"onUpdate:modelValue":t[2]||(t[2]=function(t){return e.searchQuery=t})},null,8,["title","modelValue"])]),Object(u["createElementVNode"])("span",{class:"icon-search",onClick:t[3]||(t[3]=function(t){return e.$refs.pluginSearchForm.submit()})})],8,f)])):Object(u["createCommentVNode"])("",!0)],512)}var v=n("19dc"),O=n("a5a2"),y=function(e){return"".concat(e[0].toLowerCase()).concat(e.substring(1))},h=window,j=h.$,k=Object(u["defineComponent"])({props:{pluginType:{type:String,required:!0},pluginTypeOptions:{type:[Object,Array],required:!0},sort:{type:String,required:!0},pluginSortOptions:{type:[Object,Array],required:!0},pluginsToShow:{type:Array,required:!0},query:{type:String,default:""},numAvailablePlugins:{type:Number,required:!0}},components:{Field:O["Field"]},data:function(){return{pluginSort:this.sort,pluginTypeFilter:this.pluginType,searchQuery:this.query}},created:function(){function e(e){if(e){var t=j(e);if(t&&t.length){var n=void 0,l=void 0,a=void 0,i=[],o=0;t.each((function(e,t){var r=j(t),c=r.offset(),s=c.top;o!==s&&(i=[],o=s,n=void 0,l=void 0,a=void 0),i.push(r);var u=r.find("h3").height(),d=r.find(".metadata").height(),p=r.find(".footer").height();n?n<u&&(n=u):n=u,l?l<d&&(l=d):l=d,a?a<p&&(a=p):a=p,j.each(i,(function(e,t){n&&t.find("h3").height("".concat(n,"px")),l&&t.find(".metadata").height("".concat(l,"px")),a&&t.find(".footer").height("".concat(a,"px"))}))}))}}}Object(u["nextTick"])((function(){var t=j(".marketplace .plugin .description");t.dotdotdot({after:"a.more",watch:"window"}),v["Matomo"].helper.compileVueDirectives(t),e(".marketplace .plugin")}))},methods:{changePluginSort:function(){v["MatomoUrl"].updateUrl(Object.assign(Object.assign({},v["MatomoUrl"].urlParsed.value),{},{query:"",sort:this.pluginSort}),Object.assign(Object.assign({},v["MatomoUrl"].hashParsed.value),{},{query:"",sort:this.pluginSort}))},changePluginType:function(){v["MatomoUrl"].updateUrl(Object.assign(Object.assign({},v["MatomoUrl"].urlParsed.value),{},{query:"",show:this.pluginTypeFilter}),Object.assign(Object.assign({},v["MatomoUrl"].hashParsed.value),{},{query:"",show:this.pluginTypeFilter}))}},computed:{pluginSearchFormAction:function(){return"?".concat(v["MatomoUrl"].stringify(Object.assign(Object.assign({},v["MatomoUrl"].urlParsed.value),{},{sort:"",embed:"0"})),"#?").concat(v["MatomoUrl"].stringify(Object.assign(Object.assign({},v["MatomoUrl"].hashParsed.value),{},{sort:"",embed:"0",query:this.searchQuery})))},queryInputTitle:function(){var e=y(Object(v["translate"])("General_Plugins"));return"".concat(Object(v["translate"])("General_Search")," ").concat(this.numAvailablePlugins," ").concat(e,"...")}}});k.render=g;var P=k,V={class:"marketplace-max-width"},N={class:"marketplace-paid-intro"},S={key:0},A={key:0},U=Object(u["createElementVNode"])("br",null,null,-1),w={class:"licenseToolbar valign-wrapper"},M=["href"],L={key:0},C={class:"ui-confirm",id:"installAllPaidPluginsAtOnce",ref:"installAllPaidPluginsAtOnce"},T=Object(u["createElementVNode"])("br",null,null,-1),E=Object(u["createElementVNode"])("br",null,null,-1),K=["data-href","value"],B=["value"],_={key:1},x={key:0},I=["innerHTML"],q=Object(u["createElementVNode"])("br",null,null,-1),F={class:"licenseToolbar valign-wrapper"},D={key:1},H=["innerHTML"],$={class:"ui-confirm",id:"confirmRemoveLicense",ref:"confirmRemoveLicense"},R=["value"],G=["value"];function Q(e,t,n,l,a,i){var o=Object(u["resolveComponent"])("DefaultLicenseKeyFields"),r=Object(u["resolveComponent"])("SaveButton"),c=Object(u["resolveComponent"])("ActivityIndicator");return Object(u["openBlock"])(),Object(u["createElementBlock"])("div",V,[Object(u["createElementVNode"])("div",N,[e.isValidConsumer?(Object(u["openBlock"])(),Object(u["createElementBlock"])("div",S,[e.isSuperUser?(Object(u["openBlock"])(),Object(u["createElementBlock"])("div",A,[Object(u["createTextVNode"])(Object(u["toDisplayString"])(e.translate("Marketplace_PaidPluginsWithLicenseKeyIntro",""))+" ",1),U,Object(u["createElementVNode"])("div",w,[Object(u["createVNode"])(o,{"model-value":e.licenseKey,"onUpdate:modelValue":t[0]||(t[0]=function(t){e.licenseKey=t,e.updatedLicenseKey()}),onConfirm:t[1]||(t[1]=function(t){return e.updateLicense()}),"has-license-key":e.hasLicenseKey,"is-valid-consumer":e.isValidConsumer,"enable-update":e.enableUpdate},null,8,["model-value","has-license-key","is-valid-consumer","enable-update"]),Object(u["createVNode"])(r,{class:"valign",id:"remove_license_key",onConfirm:t[2]||(t[2]=function(t){return e.removeLicense()}),value:e.translate("Marketplace_RemoveLicenseKey")},null,8,["value"]),Object(u["createElementVNode"])("a",{class:"btn valign",href:e.subscriptionOverviewLink},Object(u["toDisplayString"])(e.translate("Marketplace_ViewSubscriptions")),9,M),e.showInstallAllPaidPlugins?(Object(u["openBlock"])(),Object(u["createElementBlock"])("div",L,[Object(u["createElementVNode"])("a",{href:"",class:"btn installAllPaidPlugins valign",onClick:t[3]||(t[3]=Object(u["withModifiers"])((function(t){return e.onInstallAllPaidPlugins()}),["prevent"]))},Object(u["toDisplayString"])(e.translate("Marketplace_InstallPurchasedPlugins")),1),Object(u["createElementVNode"])("div",C,[Object(u["createElementVNode"])("h2",null,Object(u["toDisplayString"])(e.translate("Marketplace_InstallAllPurchasedPlugins")),1),Object(u["createElementVNode"])("p",null,[Object(u["createTextVNode"])(Object(u["toDisplayString"])(e.translate("Marketplace_InstallThesePlugins"))+" ",1),T,E]),Object(u["createElementVNode"])("ul",null,[(Object(u["openBlock"])(!0),Object(u["createElementBlock"])(u["Fragment"],null,Object(u["renderList"])(e.paidPluginsToInstallAtOnce,(function(e){return Object(u["openBlock"])(),Object(u["createElementBlock"])("li",{key:e},Object(u["toDisplayString"])(e),1)})),128))]),Object(u["createElementVNode"])("p",null,[Object(u["createElementVNode"])("input",{role:"install",type:"button","data-href":e.installAllPaidPluginsLink,value:e.translate("Marketplace_InstallAllPurchasedPluginsAction",e.paidPluginsToInstallAtOnce.length)},null,8,K),Object(u["createElementVNode"])("input",{role:"cancel",type:"button",value:e.translate("General_Cancel")},null,8,B)])],512)])):Object(u["createCommentVNode"])("",!0)]),Object(u["createVNode"])(c,{loading:e.isUpdating},null,8,["loading"])])):Object(u["createCommentVNode"])("",!0)])):(Object(u["openBlock"])(),Object(u["createElementBlock"])("div",_,[e.isSuperUser?(Object(u["openBlock"])(),Object(u["createElementBlock"])("div",x,[Object(u["createElementVNode"])("span",{innerHTML:e.$sanitize(e.noLicenseKeyIntroText)},null,8,I),q,Object(u["createElementVNode"])("div",F,[Object(u["createVNode"])(o,{"model-value":e.licenseKey,"onUpdate:modelValue":t[4]||(t[4]=function(t){e.licenseKey=t,e.updatedLicenseKey()}),onConfirm:t[5]||(t[5]=function(t){return e.updateLicense()}),"has-license-key":e.hasLicenseKey,"is-valid-consumer":e.isValidConsumer,"enable-update":e.enableUpdate},null,8,["model-value","has-license-key","is-valid-consumer","enable-update"])]),Object(u["createVNode"])(c,{loading:e.isUpdating},null,8,["loading"])])):(Object(u["openBlock"])(),Object(u["createElementBlock"])("div",D,[Object(u["createElementVNode"])("span",{innerHTML:e.$sanitize(e.noLicenseKeyIntroNoSuperUserAccessText)},null,8,H)]))]))]),Object(u["createElementVNode"])("div",$,[Object(u["createElementVNode"])("h2",null,Object(u["toDisplayString"])(e.translate("Marketplace_ConfirmRemoveLicense")),1),Object(u["createElementVNode"])("input",{role:"yes",type:"button",value:e.translate("General_Yes")},null,8,R),Object(u["createElementVNode"])("input",{role:"no",type:"button",value:e.translate("General_No")},null,8,G)],512)])}var z={class:"valign licenseKeyText"};function J(e,t,n,l,a,i){var o=Object(u["resolveComponent"])("Field"),r=Object(u["resolveComponent"])("SaveButton");return Object(u["openBlock"])(),Object(u["createElementBlock"])(u["Fragment"],null,[Object(u["createElementVNode"])("div",z,[Object(u["createVNode"])(o,{uicontrol:"text",name:"license_key","full-width":!0,"model-value":e.modelValue,"onUpdate:modelValue":t[0]||(t[0]=function(t){return e.$emit("update:modelValue",t)}),placeholder:e.licenseKeyPlaceholder},null,8,["model-value","placeholder"])]),Object(u["createVNode"])(r,{class:"valign",onConfirm:t[1]||(t[1]=function(t){return e.$emit("confirm")}),disabled:!e.enableUpdate,value:e.saveButtonText,id:"submit_license_key"},null,8,["disabled","value"])],64)}var W=Object(u["defineComponent"])({props:{modelValue:String,isValidConsumer:Boolean,hasLicenseKey:Boolean,enableUpdate:Boolean},emits:["update:modelValue","confirm"],components:{Field:O["Field"],SaveButton:O["SaveButton"]},computed:{licenseKeyPlaceholder:function(){return this.isValidConsumer?Object(v["translate"])("Marketplace_LicenseKeyIsValidShort"):Object(v["translate"])("Marketplace_LicenseKey")},saveButtonText:function(){return this.hasLicenseKey?Object(v["translate"])("CoreUpdater_UpdateTitle"):Object(v["translate"])("Marketplace_ActivateLicenseKey")}}});W.render=J;var Y=W,X=Object(u["defineComponent"])({props:{isValidConsumer:Boolean,isSuperUser:Boolean,isAutoUpdatePossible:Boolean,isPluginsAdminEnabled:Boolean,hasLicenseKey:Boolean,paidPluginsToInstallAtOnce:{type:Array,required:!0},installNonce:{type:String,required:!0}},components:{SaveButton:O["SaveButton"],ActivityIndicator:v["ActivityIndicator"],DefaultLicenseKeyFields:Y},data:function(){return{licenseKey:"",enableUpdate:!1,isUpdating:!1}},methods:{onInstallAllPaidPlugins:function(){v["Matomo"].helper.modalConfirm(this.$refs.installAllPaidPluginsAtOnce)},updateLicenseKey:function(e,t,n){var l=this;v["AjaxHelper"].post({module:"API",method:"Marketplace.".concat(e),format:"JSON"},{licenseKey:this.licenseKey},{withTokenInUrl:!0}).then((function(e){l.isUpdating=!1,e&&e.value&&(v["NotificationsStore"].show({message:n,context:"success",type:"transient"}),v["Matomo"].helper.redirect())}),(function(){l.isUpdating=!1}))},removeLicense:function(){var e=this;v["Matomo"].helper.modalConfirm(this.$refs.confirmRemoveLicense,{yes:function(){e.enableUpdate=!1,e.isUpdating=!0,e.updateLicenseKey("deleteLicenseKey","",Object(v["translate"])("Marketplace_LicenseKeyDeletedSuccess"))}})},updatedLicenseKey:function(){this.enableUpdate=!!this.licenseKey},updateLicense:function(){this.enableUpdate=!1,this.isUpdating=!0,this.updateLicenseKey("saveLicenseKey",this.licenseKey,Object(v["translate"])("Marketplace_LicenseKeyActivatedSuccess"))}},computed:{subscriptionOverviewLink:function(){return"?".concat(v["MatomoUrl"].stringify(Object.assign(Object.assign({},v["MatomoUrl"].urlParsed.value),{},{action:"subscriptionOverview"})))},noLicenseKeyIntroText:function(){return Object(v["translate"])("Marketplace_PaidPluginsNoLicenseKeyIntro",'<a target="_blank" rel="noreferrer noopener" href="https://matomo.org/recommends/premium-plugins/">',"</a>")},noLicenseKeyIntroNoSuperUserAccessText:function(){return Object(v["translate"])("Marketplace_PaidPluginsNoLicenseKeyIntroNoSuperUserAccess",'<a target="_blank" rel="noreferrer noopener" href="https://matomo.org/recommends/premium-plugins/">',"</a>")},installAllPaidPluginsLink:function(){return"?".concat(v["MatomoUrl"].stringify(Object.assign(Object.assign({},v["MatomoUrl"].urlParsed.value),{},{action:"installAllPaidPlugins",nonce:this.installNonce})))},showInstallAllPaidPlugins:function(){return this.isAutoUpdatePossible&&this.isPluginsAdminEnabled&&this.paidPluginsToInstallAtOnce.length}}});X.render=Q;var Z=X; /*! * Matomo - free/libre analytics platform * diff --git a/plugins/Marketplace/vue/src/LicenseKey/LicenseKey.vue b/plugins/Marketplace/vue/src/LicenseKey/LicenseKey.vue index 637b248e2b..7ccfcfe70a 100644 --- a/plugins/Marketplace/vue/src/LicenseKey/LicenseKey.vue +++ b/plugins/Marketplace/vue/src/LicenseKey/LicenseKey.vue @@ -34,14 +34,16 @@ </a> <div v-if="showInstallAllPaidPlugins"> <a - href="javascript:;" + href="" class="btn installAllPaidPlugins valign" + @click.prevent="onInstallAllPaidPlugins()" > {{ translate('Marketplace_InstallPurchasedPlugins') }} </a> <div class="ui-confirm" id="installAllPaidPluginsAtOnce" + ref="installAllPaidPluginsAtOnce" > <h2>{{ translate('Marketplace_InstallAllPurchasedPlugins') }}</h2> <p> @@ -153,6 +155,9 @@ export default defineComponent({ }; }, methods: { + onInstallAllPaidPlugins() { + Matomo.helper.modalConfirm(this.$refs.installAllPaidPluginsAtOnce as HTMLElement); + }, updateLicenseKey(action: string, licenseKey: string, onSuccessMessage: string) { AjaxHelper.post( { diff --git a/plugins/Marketplace/vue/src/Marketplace/Marketplace.vue b/plugins/Marketplace/vue/src/Marketplace/Marketplace.vue new file mode 100644 index 0000000000..6e8adc90dc --- /dev/null +++ b/plugins/Marketplace/vue/src/Marketplace/Marketplace.vue @@ -0,0 +1,244 @@ +<!-- + Matomo - free/libre analytics platform + @link https://matomo.org + @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later +--> + +<template> + <div class="row marketplaceActions" ref="root"> + <div class="col s12 m6 l4"> + <Field + uicontrol="select" + name="plugin_type" + :model-value="pluginTypeFilter" + @update:model-value="pluginTypeFilter = $event; changePluginType()" + :title="translate('Marketplace_Show')" + :full-width="true" + :options="pluginTypeOptions" + > + </Field> + </div> + <div class="col s12 m6 l4"> + <Field + uicontrol="select" + name="plugin_sort" + :model-value="pluginSort" + @update:model-value="pluginSort = $event; changePluginSort()" + :title="translate('Marketplace_Sort')" + :full-width="true" + :options="pluginSortOptions" + > + </Field> + </div> + <!-- Hide filters and search for themes because we don't have many of them --> + <div class="col s12 m12 l4 " v-if="pluginsToShow.length > 20 || query"> + <form + method="post" + class="plugin-search" + :action="pluginSearchFormAction" + ref="pluginSearchForm" + > + <div> + <Field + uicontrol="text" + name="query" + :title="queryInputTitle" + :full-width="true" + v-model="searchQuery" + > + </Field> + </div> + <span + class="icon-search" + @click="$refs.pluginSearchForm.submit()" + /> + </form> + </div> + </div> +</template> + +<script lang="ts"> +import { defineComponent, nextTick } from 'vue'; +import { translate, MatomoUrl, Matomo } from 'CoreHome'; +import { Field } from 'CorePluginsAdmin'; + +interface MarketplaceState { + pluginSort: string; + pluginTypeFilter: string; + searchQuery: string; +} + +const lcfirst = (s: string) => `${s[0].toLowerCase()}${s.substring(1)}`; + +const { $ } = window; + +export default defineComponent({ + props: { + pluginType: { + type: String, + required: true, + }, + pluginTypeOptions: { + type: [Object, Array], + required: true, + }, + sort: { + type: String, + required: true, + }, + pluginSortOptions: { + type: [Object, Array], + required: true, + }, + pluginsToShow: { + type: Array, + required: true, + }, + query: { + type: String, + default: '', + }, + numAvailablePlugins: { + type: Number, + required: true, + }, + }, + components: { + Field, + }, + data(): MarketplaceState { + return { + pluginSort: this.sort, + pluginTypeFilter: this.pluginType, + searchQuery: this.query, + }; + }, + created() { + function syncMaxHeight2(selector: string) { + if (!selector) { + return; + } + + const $nodes = $(selector); + if (!$nodes || !$nodes.length) { + return; + } + + let maxh3: number|undefined = undefined; + let maxMeta: number|undefined = undefined; + let maxFooter: number|undefined = undefined; + let nodesToUpdate: JQuery[] = []; + let lastTop = 0; + $nodes.each((index, node) => { + const $node = $(node); + const { top } = $node.offset()!; + + if (lastTop !== top) { + nodesToUpdate = []; + lastTop = top; + maxh3 = undefined; + maxMeta = undefined; + maxFooter = undefined; + } + + nodesToUpdate.push($node); + + const heightH3 = $node.find('h3').height()!; + const heightMeta = $node.find('.metadata').height()!; + const heightFooter = $node.find('.footer').height()!; + + if (!maxh3) { + maxh3 = heightH3; + } else if (maxh3 < heightH3) { + maxh3 = heightH3; + } + + if (!maxMeta) { + maxMeta = heightMeta; + } else if (maxMeta < heightMeta) { + maxMeta = heightMeta; + } + + if (!maxFooter) { + maxFooter = heightFooter; + } else if (maxFooter < heightFooter) { + maxFooter = heightFooter; + } + + $.each(nodesToUpdate, (i, $nodeToUpdate) => { + if (maxh3) { + $nodeToUpdate.find('h3').height(`${maxh3}px`); + } + if (maxMeta) { + $nodeToUpdate.find('.metadata').height(`${maxMeta}px`); + } + if (maxFooter) { + $nodeToUpdate.find('.footer').height(`${maxFooter}px`); + } + }); + }); + } + + nextTick(() => { + // Keeps the plugin descriptions the same height + const descriptions = $('.marketplace .plugin .description'); + descriptions.dotdotdot({ + after: 'a.more', + watch: 'window', + }); + + Matomo.helper.compileVueDirectives(descriptions); // have to recompile any vue directives + + syncMaxHeight2('.marketplace .plugin'); + }); + }, + methods: { + changePluginSort() { + MatomoUrl.updateUrl( + { + ...MatomoUrl.urlParsed.value, + query: '', + sort: this.pluginSort, + }, + { + ...MatomoUrl.hashParsed.value, + query: '', + sort: this.pluginSort, + }, + ); + }, + changePluginType() { + MatomoUrl.updateUrl( + { + ...MatomoUrl.urlParsed.value, + query: '', + show: this.pluginTypeFilter, + }, + { + ...MatomoUrl.hashParsed.value, + query: '', + show: this.pluginTypeFilter, + }, + ); + }, + }, + computed: { + pluginSearchFormAction(): string { + return `?${MatomoUrl.stringify({ + ...MatomoUrl.urlParsed.value, + sort: '', + embed: '0', + })}#?${MatomoUrl.stringify({ + ...MatomoUrl.hashParsed.value, + sort: '', + embed: '0', + query: this.searchQuery, + })}`; + }, + queryInputTitle(): string { + const plugins = lcfirst(translate('General_Plugins')); + return `${translate('General_Search')} ${this.numAvailablePlugins} ${plugins}...`; + }, + }, +}); +</script> diff --git a/plugins/Marketplace/vue/src/PluginName/PluginName.adapter.ts b/plugins/Marketplace/vue/src/PluginName/PluginName.adapter.ts new file mode 100644 index 0000000000..1259800d45 --- /dev/null +++ b/plugins/Marketplace/vue/src/PluginName/PluginName.adapter.ts @@ -0,0 +1,34 @@ +/*! + * Matomo - free/libre analytics platform + * + * @link https://matomo.org + * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later + */ + +import { IAttributes, IScope } from 'angular'; +import PluginName from './PluginName'; + +function piwikPluginName() { + return { + restrict: 'A', + link(scope: IScope, element: JQuery, attrs: IAttributes) { + const binding = { + instance: null, + value: { + pluginName: attrs.piwikPluginName, + activePluginTab: attrs.activeplugintab, + }, + oldValue: null, + modifiers: {}, + dir: {}, + }; + + PluginName.mounted(element[0], binding); + element.on('$destroy', () => { + PluginName.unmounted(element[0], binding); + }); + }, + }; +} + +window.angular.module('piwikApp').directive('piwikPluginName', piwikPluginName); diff --git a/plugins/Marketplace/vue/src/PluginName/PluginName.ts b/plugins/Marketplace/vue/src/PluginName/PluginName.ts new file mode 100644 index 0000000000..c12b4681ee --- /dev/null +++ b/plugins/Marketplace/vue/src/PluginName/PluginName.ts @@ -0,0 +1,68 @@ +/*! + * Matomo - free/libre analytics platform + * + * @link https://matomo.org + * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later + */ + +import { DirectiveBinding } from 'vue'; +import ClickEvent = JQuery.ClickEvent; + +window.broadcast.addPopoverHandler('browsePluginDetail', (value) => { + let pluginName = value; + let activeTab = null; + + if (value.indexOf('!') !== -1) { + activeTab = value.substr(value.indexOf('!') + 1); + pluginName = value.substr(0, value.indexOf('!')); + } + + let url = `module=Marketplace&action=pluginDetails&pluginName=${encodeURIComponent(pluginName)}`; + if (activeTab) { + url += `&activeTab=${encodeURIComponent(activeTab)}`; + } + + window.Piwik_Popover.createPopupAndLoadUrl(url, 'details'); +}); + +interface PluginNameDirectiveValue { + // input + pluginName: string; + activePluginTab: string; + + // state + onClickHandler?: (event: ClickEvent) => void; +} + +function onClickPluginNameLink( + binding: DirectiveBinding<PluginNameDirectiveValue>, + event: ClickEvent, +) { + let { pluginName } = binding.value; + const { activePluginTab } = binding.value; + + event.preventDefault(); + + if (activePluginTab) { + pluginName += `!${activePluginTab}`; + } + + window.broadcast.propagateNewPopoverParameter('browsePluginDetail', pluginName); +} + +const { $ } = window; + +export default { + mounted(element: HTMLElement, binding: DirectiveBinding<PluginNameDirectiveValue>): void { + const { pluginName } = binding.value; + if (!pluginName) { + return; + } + + binding.value.onClickHandler = onClickPluginNameLink.bind(null, binding); + $(element).on('click', binding.value.onClickHandler!); + }, + unmounted(element: HTMLElement, binding: DirectiveBinding<PluginNameDirectiveValue>): void { + $(element).off('click', binding.value.onClickHandler!); + }, +}; diff --git a/plugins/Marketplace/vue/src/index.ts b/plugins/Marketplace/vue/src/index.ts index 0eb27f81ef..a26fdfd6fb 100644 --- a/plugins/Marketplace/vue/src/index.ts +++ b/plugins/Marketplace/vue/src/index.ts @@ -5,4 +5,8 @@ * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later */ +import './PluginName/PluginName.adapter'; + +export { default as Marketplace } from './Marketplace/Marketplace.vue'; export { default as LicenseKey } from './LicenseKey/LicenseKey.vue'; +export { default as PluginName } from './PluginName/PluginName'; diff --git a/plugins/Morpheus/javascripts/piwikHelper.js b/plugins/Morpheus/javascripts/piwikHelper.js index 7fc4c9ddb9..b80c550df0 100644 --- a/plugins/Morpheus/javascripts/piwikHelper.js +++ b/plugins/Morpheus/javascripts/piwikHelper.js @@ -164,6 +164,7 @@ window.piwikHelper = { .replace(/[A-Z]/g, function (s) { return '-' + s[0].toLowerCase(); }); } + // process vue-entry attributes $('[vue-entry]', selector).add($(selector).filter('[vue-entry]')).each(function () { var entry = $(this).attr('vue-entry'); var componentsToRegister = ($(this).attr('vue-components') || '').split(/\s+/).filter(function (s) { @@ -179,7 +180,7 @@ window.piwikHelper = { var createVueApp = CoreHome.createVueApp; var plugin = window[parts[0]]; if (!plugin) { - throw new Error('Unknown plugin in vue-entry: ' + plugin); + throw new Error('Unknown plugin in vue-entry: ' + entry); } var component = plugin[parts[1]]; @@ -239,6 +240,52 @@ window.piwikHelper = { app.unmount(); }); }); + + // process vue-directive attributes (only uses .mounted/.unmounted hooks) + piwikHelper.compileVueDirectives(selector); + }, + + compileVueDirectives: function (selector) { + $('[vue-directive]', selector).add($(selector).filter('[vue-entry]')).each(function () { + var vueDirectiveName = $(this).attr('vue-directive'); + + var parts = vueDirectiveName.split('.'); + if (parts.length !== 2) { + throw new Error('Expects vue-entry to have format Plugin.Component, where Component is exported Vue component. Got: ' + vueDirectiveName); + } + + var plugin = window[parts[0]]; + if (!plugin) { + throw new Error('Unknown plugin in vue-entry: ' + vueDirectiveName); + } + + var directive = plugin[parts[1]]; + if (!directive) { + throw new Error('Unknown component in vue-entry: ' + vueDirectiveName); + } + + var directiveArgument = $(this).attr('vue-directive-value'); + + var value; + try { + value = JSON.parse(directiveArgument || '{}'); + } catch (e) { + console.log('failed to parse directive value ' + value + ': ' + directiveArgument); + return; + } + + var binding = { value: value }; + + if (directive.mounted) { + directive.mounted(this, binding); + } + + this.addEventListener('matomoVueDestroy', function () { + if (directive.unmounted) { + directive.unmounted(this, binding); + } + }); + }); }, destroyVueComponent: function (selector) { diff --git a/tsconfig.json b/tsconfig.json index c288f4a0ee..4b2257761b 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -22,7 +22,8 @@ "jquery", "jqueryui", "materialize-css", - "mousetrap" + "mousetrap", + "dotdotdot" ], "paths": { "*": ["@types/*", "*"] |