← All changes | js/packages/floating-links/config.js +96 -90 6.4 → trunk View file →

		@@ -1,106 +1,112 @@
1	1	/**
2	2	* Configuration File.
3	3	* Establishes links and options parameters to be utilized by the S11FloatingLinks class.
4	4	*
	5	+ * @param {Object} wp
5	6	* @class S11FloatingLinks
6	7	*/
7	8
8		-/**
9		- * WordPress dependencies
10		- */
11		-const { __ } = wp.i18n;
	9	+( wp => {
	10	+ /**
	11	+ * WordPress dependencies
	12	+ */
	13	+ const { __ } = wp.i18n;
12	14
13		-/**
14		- * SVG definitions for the icons
15		- */
16		-// Icon for Upgrade link
17		-const upgradeIcon = `
18		- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
19		- <path stroke="#667085" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m12 4.75 1.75 5.5h5.5l-4.5 3.5 1.5 5.5-4.25-3.5-4.25 3.5 1.5-5.5-4.5-3.5h5.5L12 4.75Z"/>
20		- </svg>
21		-`;
	15	+ // Define a configuration variable for Formidable's floating links.
	16	+ const frmFloatingLinksConfig = {};
22	17
23		-// Icon for Support link
24		-const supportIcon = `
25		- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
26		- <path stroke="#667085" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19.25 12a7.25 7.25 0 1 1-14.5 0 7.25 7.25 0 0 1 14.5 0Z"/>
27		- <path stroke="#667085" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M15.25 12a3.25 3.25 0 1 1-6.5 0 3.25 3.25 0 0 1 6.5 0ZM7 17l2.5-2.5M17 17l-2.5-2.5m-5-5L7 7m7.5 2.5L17 7"/>
28		- </svg>
29		-`;
	18	+ /**
	19	+ * SVG definitions for the icons
	20	+ */
	21	+ // Icon for Upgrade link
	22	+ frmFloatingLinksConfig.upgradeIcon = `
	23	+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
	24	+ <path stroke="#667085" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m12 4.75 1.75 5.5h5.5l-4.5 3.5 1.5 5.5-4.25-3.5-4.25 3.5 1.5-5.5-4.5-3.5h5.5L12 4.75Z"/>
	25	+ </svg>
	26	+ `;
30	27
31		-// Icon for Documentation link
32		-const documentationIcon = `
33		- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
34		- <path stroke="#667085" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m14.924 16.002.482 2.432c.106.537.682.895 1.286.8l1.64-.256c.604-.095 1.007-.607.9-1.145l-.481-2.431m-3.827.6-1.157-5.835c-.106-.538.297-1.05.9-1.145l1.64-.257c.605-.095 1.18.264 1.287.801l1.157 5.836m-3.827.6 3.827-.6M8.75 15.75v2.5a1 1 0 0 0 1 1h1.5a1 1 0 0 0 1-1v-2.5m-3.5 0v-8a1 1 0 0 1 1-1h1.5a1 1 0 0 1 1 1v8m-3.5 0h3.5m-7.5 0v2.5a1 1 0 0 0 1 1h1.5a1 1 0 0 0 1-1v-2.5m-3.5 0v-10a1 1 0 0 1 1-1h1.5a1 1 0 0 1 1 1v10m-3.5 0h3.5"/>
35		- </svg>
36		-`;
	28	+ // Icon for Support link
	29	+ frmFloatingLinksConfig.supportIcon = `
	30	+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
	31	+ <path stroke="#667085" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19.25 12a7.25 7.25 0 1 1-14.5 0 7.25 7.25 0 0 1 14.5 0Z"/>
	32	+ <path stroke="#667085" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M15.25 12a3.25 3.25 0 1 1-6.5 0 3.25 3.25 0 0 1 6.5 0ZM7 17l2.5-2.5M17 17l-2.5-2.5m-5-5L7 7m7.5 2.5L17 7"/>
	33	+ </svg>
	34	+ `;
37	35
38		-// Icon for Notifications link
39		-const notificationsIcon = `
40		- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
41		- <path stroke="#667085" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M17.25 12v-2a5.25 5.25 0 1 0-10.5 0v2l-2 4.25h14.5l-2-4.25ZM9 16.75s0 2.5 3 2.5 3-2.5 3-2.5"/>
42		- </svg>
43		-`;
	36	+ // Icon for Documentation link
	37	+ frmFloatingLinksConfig.documentationIcon = `
	38	+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
	39	+ <path stroke="#667085" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m14.924 16.002.482 2.432c.106.537.682.895 1.286.8l1.64-.256c.604-.095 1.007-.607.9-1.145l-.481-2.431m-3.827.6-1.157-5.835c-.106-.538.297-1.05.9-1.145l1.64-.257c.605-.095 1.18.264 1.287.801l1.157 5.836m-3.827.6 3.827-.6M8.75 15.75v2.5a1 1 0 0 0 1 1h1.5a1 1 0 0 0 1-1v-2.5m-3.5 0v-8a1 1 0 0 1 1-1h1.5a1 1 0 0 1 1 1v8m-3.5 0h3.5m-7.5 0v2.5a1 1 0 0 0 1 1h1.5a1 1 0 0 0 1-1v-2.5m-3.5 0v-10a1 1 0 0 1 1-1h1.5a1 1 0 0 1 1 1v10m-3.5 0h3.5"/>
	40	+ </svg>
	41	+ `;
44	42
45		-/**
46		- * Define links for the "free" version of the plugin
47		- */
48		-const freeVersionLinks = [
49		- {
50		- title: __( 'Upgrade', 'formidable' ),
51		- icon: upgradeIcon,
52		- url: 'https://formidableforms.com/lite-upgrade/',
53		- openInNewTab: true
54		- },
55		- {
56		- title: __( 'Support', 'formidable' ),
57		- icon: supportIcon,
58		- url: 'https://wordpress.org/support/plugin/formidable/',
59		- openInNewTab: true
60		- },
61		- {
62		- title: __( 'Documentation', 'formidable' ),
63		- icon: documentationIcon,
64		- url: 'https://formidableforms.com/knowledgebase/',
65		- openInNewTab: true
66		- }
67		-];
	43	+ // Icon for Notifications link
	44	+ frmFloatingLinksConfig.notificationsIcon = `
	45	+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
	46	+ <path stroke="#667085" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M17.25 12v-2a5.25 5.25 0 1 0-10.5 0v2l-2 4.25h14.5l-2-4.25ZM9 16.75s0 2.5 3 2.5 3-2.5 3-2.5"/>
	47	+ </svg>
	48	+ `;
68	49
69		-/**
70		- * Define links for the "pro" version of the plugin
71		- */
72		-const proVersionLinks = [
73		- {
74		- title: __( 'Support & Docs', 'formidable' ),
75		- icon: supportIcon,
76		- url: 'https://formidableforms.com/knowledgebase/',
77		- openInNewTab: true
78		- }
79		-];
	50	+ /**
	51	+ * Define links for the "free" version of the plugin
	52	+ */
	53	+ frmFloatingLinksConfig.freeVersionLinks = [
	54	+ {
	55	+ title: __( 'Upgrade', 'formidable' ),
	56	+ icon: frmFloatingLinksConfig.upgradeIcon,
	57	+ url: s11FloatingLinksData.upgradeUrl,
	58	+ openInNewTab: true
	59	+ },
	60	+ {
	61	+ title: __( 'Support', 'formidable' ),
	62	+ icon: frmFloatingLinksConfig.supportIcon,
	63	+ url: 'https://wordpress.org/support/plugin/formidable/',
	64	+ openInNewTab: true
	65	+ },
	66	+ {
	67	+ title: __( 'Documentation', 'formidable' ),
	68	+ icon: frmFloatingLinksConfig.documentationIcon,
	69	+ url: s11FloatingLinksData.documentationUrl,
	70	+ openInNewTab: true
	71	+ }
	72	+ ];
80	73
81		-/**
82		- * Define options
83		- */
84		-const options = {
85		- hoverColor: '#4199FD',
86		- bgHoverColor: '#F5FAFF',
87		- logoIcon: `
88		- <svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" fill="none" viewBox="0 0 40 40">
89		- <g clip-path="url(#a)">
90		- <path fill="#F15A24" d="M19.265 25.641h9.401v4.957h-9.401v-4.957Z"/>
91		- <path fill="#5E5E5F" d="M26.702 9.743H13.368a2.12 2.12 0 0 0-2.136 2.12V14.7h17.436V9.743h-1.966Zm-.171 7.864H11.249v12.991h4.957v-8.034h10.36a2.154 2.154 0 0 0 2.016-1.419 1.67 1.67 0 0 0 .103-.598v-2.94H26.53ZM20 40a20 20 0 0 1-6.748-38.827 20 20 0 0 1 14.526 37.254A19.847 19.847 0 0 1 20 40Zm0-37.35A17.35 17.35 0 0 0 7.727 32.272 17.358 17.358 0 0 0 32.275 7.726 17.232 17.232 0 0 0 20 2.666V2.65Z"/>
92		- </g>
93		- <defs>
94		- <clipPath id="a">
95		- <path fill="#fff" d="M0 0h40v40H0z"/>
96		- </clipPath>
97		- </defs>
98		- </svg>
99		- `
100		-};
	74	+ /**
	75	+ * Define links for the "pro" version of the plugin
	76	+ */
	77	+ frmFloatingLinksConfig.proVersionLinks = [
	78	+ {
	79	+ title: __( 'Support & Docs', 'formidable' ),
	80	+ icon: frmFloatingLinksConfig.supportIcon,
	81	+ url: s11FloatingLinksData.documentationUrl,
	82	+ openInNewTab: true
	83	+ }
	84	+ ];
101	85
102		-// Determine the appropriate links and initialize the S11FloatingLinks class
103		-const links = s11FloatingLinksData.proIsInstalled ? proVersionLinks : freeVersionLinks;
	86	+ /**
	87	+ * Define options
	88	+ */
	89	+ frmFloatingLinksConfig.options = {
	90	+ hoverColor: '#4199FD',
	91	+ bgHoverColor: '#F5FAFF',
	92	+ logoIcon: `
	93	+ <svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" fill="none" viewBox="0 0 40 40">
	94	+ <g clip-path="url(#floatingLinksClipPath)">
	95	+ <path fill="#F15A24" d="M19.265 25.641h9.401v4.957h-9.401v-4.957Z"/>
	96	+ <path fill="#5E5E5F" d="M26.702 9.743H13.368a2.12 2.12 0 0 0-2.136 2.12V14.7h17.436V9.743h-1.966Zm-.171 7.864H11.249v12.991h4.957v-8.034h10.36a2.154 2.154 0 0 0 2.016-1.419 1.67 1.67 0 0 0 .103-.598v-2.94H26.53ZM20 40a20 20 0 0 1-6.748-38.827 20 20 0 0 1 14.526 37.254A19.847 19.847 0 0 1 20 40Zm0-37.35A17.35 17.35 0 0 0 7.727 32.272 17.358 17.358 0 0 0 32.275 7.726 17.232 17.232 0 0 0 20 2.666V2.65Z"/>
	97	+ </g>
	98	+ <defs>
	99	+ <clipPath id="floatingLinksClipPath">
	100	+ <path fill="#fff" d="M0 0h40v40H0z"/>
	101	+ </clipPath>
	102	+ </defs>
	103	+ </svg>
	104	+ `
	105	+ };
104	106
105		-// Trigger the 'set_floating_links_config' action, passing the links and options
106		-wp.hooks.doAction( 'set_floating_links_config', { links, options });
	107	+ // Determine the appropriate links and initialize the S11FloatingLinks class
	108	+ frmFloatingLinksConfig.links = s11FloatingLinksData.proIsInstalled ? frmFloatingLinksConfig.proVersionLinks : frmFloatingLinksConfig.freeVersionLinks;
	109	+
	110	+ // Trigger the 'set_floating_links_config' action, passing the config
	111	+ wp.hooks.doAction( 'set_floating_links_config', frmFloatingLinksConfig );
	112	+} )( window.wp );