Link Library / trunk

Link Library vtrunk

link-library / src / link-block / edit.js

edit.js in Link Library trunk, at src/link-block/edit.js

275 lines 10.0 KB

Raw Download Zip

1	import ServerSideRender from '@wordpress/server-side-render';
2	import { __ } from '@wordpress/i18n';
3	import { SelectControl,
4	Toolbar,
5	Button,
6	Tooltip,
7	PanelBody,
8	PanelRow,
9	FormToggle,
10	ToggleControl,
11	ToolbarGroup,
12	Disabled,
13	RadioControl,
14	RangeControl,
15	TextControl,
16	CheckboxControl,
17	FontSizePicker } from '@wordpress/components';
18
19	import {
20	RichText,
21	AlignmentToolbar,
22	BlockControls,
23	BlockAlignmentToolbar,
24	InspectorControls,
25	InnerBlocks,
26	withColors,
27	PanelColorSettings,
28	getColorClassName
29	} from '@wordpress/block-editor'
30	;
31	import { withSelect, widthDispatch } from '@wordpress/data';
32	import { useState } from '@wordpress/element';
33
34	const {
35	withState
36	} = wp.compose;
37
38	const linkOrderOptions = [
39	{ label: 'Select an option to override', value: '' },
40	{ label: 'Name', value: 'name' },
41	{ label: 'Link ID', value: 'id' },
42	{ label: 'Random', value: 'random' },
43	{ label: 'Updated Date', value: 'date' },
44	{ label: 'Publication Date', value: 'pubdate' },
45	{ label: 'Link Visits', value: 'hits' },
46	{ label: 'User Votes', value: 'uservotes' },
47	{ label: 'Simple Custom Post Order plugin', value: 'scpo' },
48	];
49
50	const linkDirectionOptions = [
51	{ label: 'Select an option to override', value: '' },
52	{ label: 'Ascending', value: 'ASC' },
53	{ label: 'Descending', value: 'DESC' },
54	];
55
56
57	const settingsidOptions = [
58	];
59
60	wp.apiFetch({path: "/link-library/v1/settingslist"}).then(posts => {
61	jQuery.each( posts, function( key, val ) {
62	settingsidOptions.push( {label: 'Library #' + key + ': ' + val, value: key} );
63	});
64	}).catch(
65
66	)
67
68	const categoryOptions = [
69	];
70
71	wp.apiFetch({path: "/wp/v2/link_library_category?per_page=100"}).then(posts => {
72	jQuery.each( posts, function( key, val ) {
73	categoryOptions.push({label: val.name, value: val.id});
74	});
75	}).catch(
76
77	)
78
79	const tagOptions = [
80	];
81
82	wp.apiFetch({path: "/wp/v2/link_library_tags?per_page=100"}).then(posts => {
83	jQuery.each( posts, function( key, val ) {
84	tagOptions.push({label: val.name, value: val.id});
85	});
86	}).catch(
87
88	)
89
90	const edit = props => {
91	const {attributes: { settings, linkorderoverride, linkdirectionoverride, categorylistoverride, excludecategoryoverride, taglistoverride, maxlinksoverride, notesoverride, descoverride, rssoverride, categorylistoverrideCSV, excludecategoryoverrideCSV, taglistoverrideCSV }, className, setAttributes } = props;
92
93	const setSettingsID = settings => {
94	props.setAttributes( { settings } );
95	};
96
97	const setLinkOrder = linkorderoverride => {
98	props.setAttributes( { linkorderoverride } );
99	};
100
101	const setLinkDirection = linkdirectionoverride => {
102	props.setAttributes( { linkdirectionoverride } );
103	};
104
105	const setOverrideCategories = categorylistoverride => {
106	props.setAttributes( { categorylistoverride } );
107	};
108
109	const setExcludeOverrideCategories = excludecategoryoverride => {
110	props.setAttributes( { excludecategoryoverride } );
111	};
112
113	const setTagOverride = taglistoverride => {
114	props.setAttributes( { taglistoverride } );
115	};
116
117	const setNotesOverride = notesoverride => {
118	props.setAttributes( { notesoverride } );
119	}
120
121	const setDescOverride = descoverride => {
122	props.setAttributes( { descoverride } );
123	}
124
125	const setRSSOverride = rssoverride => {
126	props.setAttributes( { rssoverride } );
127	}
128
129	const setCategoryOverrideArrayCSV = categorylistoverrideCSV => {
130	props.setAttributes( { categorylistoverrideCSV } );
131	}
132
133	const setExcludeCategoryOverrideArrayCSV = excludecategoryoverrideCSV => {
134	props.setAttributes( { excludecategoryoverrideCSV } );
135	}
136
137	const setTagOverrideArrayCSV = taglistoverrideCSV => {
138	props.setAttributes( { taglistoverrideCSV } );
139	}
140
141	const setMaxLinksOverride = maxlinksoverride => {
142	props.setAttributes( { maxlinksoverride } );
143	}
144
145	const inspectorControls = (
146	<InspectorControls key="inspector">
147	<PanelBody>
148	<PanelRow>
149	<SelectControl
150	label="Library Configuration"
151	value={ settings }
152	options= { settingsidOptions }
153	onChange = { setSettingsID }
154	/>
155	</PanelRow>
156	</PanelBody>
157	<PanelBody title={ __( 'Configuration overrides' )} initialOpen={ false }>
158	<PanelRow>
159	<SelectControl
160	label="Link Order Override"
161	value={ linkorderoverride }
162	options= { linkOrderOptions }
163	onChange = { setLinkOrder }
164	/>
165	</PanelRow>
166	<PanelRow>
167	<SelectControl
168	label="Library Configuration"
169	value={ linkdirectionoverride }
170	options= { linkDirectionOptions }
171	onChange = { setLinkDirection }
172	/>
173	</PanelRow>
174	<PanelRow>
175	<span className="link-library-cat-override">
176	<SelectControl
177	multiple
178	label = "Override Categories to display"
179	help = "Select one or more categories to override library category list. Ctrl-Click to select multiple items or deselect an item."
180	value = { categorylistoverride }
181	options = { categoryOptions }
182	onChange = { setOverrideCategories }
183	/>
184	</span>
185	</PanelRow>
186	<PanelRow>
187	<span className="link-library-cat-exclude-override">
188	<SelectControl
189	multiple
190	label = "Override Categories to be excluded"
191	help = "Select one or more categories to override excluded category list. Ctrl-Click to select multiple items or deselect an item."
192	value = { excludecategoryoverride }
193	options = { categoryOptions }
194	onChange = { setExcludeOverrideCategories }
195	/>
196	</span>
197	</PanelRow>
198	<PanelRow>
199	<span className="link-library-tag-override">
200	<SelectControl
201	multiple
202	label = "Override Tags to display"
203	help = "Select one or more tags to override library tag list. Ctrl-Click to select multiple items or deselect an item."
204	value = { taglistoverride }
205	options = { tagOptions }
206	onChange = { setTagOverride }
207	/>
208	</span>
209	</PanelRow>
210	<TextControl
211	label = "Max number of links to display"
212	value = { props.attributes.maxlinksoverride }
213	onChange = { setMaxLinksOverride }
214	/>
215	<PanelRow>
216	<CheckboxControl
217	label="Force Notes Display"
218	checked ={ props.attributes.notesoverride }
219	onChange = { setNotesOverride }
220	/>
221	</PanelRow>
222	<PanelRow>
223	<CheckboxControl
224	label="Force Description Display"
225	checked ={ props.attributes.descoverride }
226	onChange = { setDescOverride }
227	/>
228	</PanelRow>
229	<PanelRow>
230	<CheckboxControl
231	label="Force RSS Display"
232	checked ={ props.attributes.rssoverride }
233	onChange = { setRSSOverride }
234	/>
235	</PanelRow>
236	</PanelBody>
237	<PanelBody title={ __( 'CSV category list overrides' )} initialOpen={ false }>
238	<PanelRow>
239	<TextControl
240	label = "Comma-separated list of category IDs to display"
241	value = { props.attributes.categorylistoverrideCSV }
242	onChange = { setCategoryOverrideArrayCSV }
243	/>
244	</PanelRow>
245	<PanelRow>
246	<TextControl
247	label = "Comma-separated list of category IDs to exclude"
248	value = { props.attributes.excludecategoryoverrideCSV }
249	onChange = { setExcludeCategoryOverrideArrayCSV }
250	/>
251	</PanelRow>
252	<PanelRow>
253	<TextControl
254	label = "Comma-separated list of tag IDs to display"
255	value = { props.attributes.taglistoverrideCSV }
256	onChange = { setTagOverrideArrayCSV }
257	/>
258	</PanelRow>
259	</PanelBody>
260	</InspectorControls>
261	);
262	return [
263	<div className={ props.className } key="returneddata">
264	<div className="ll-block-warning">Warning: Some Link Library features like Pagination, AJAX category switching and Masonry layout won't work as you build your page in the Block Editor but will work correctly when viewed on your site.</div>
265	<ServerSideRender
266	block="link-library/link-block"
267	attributes = {props.attributes}
268	/>
269	{ inspectorControls }
270	</div>
271	];
272	};
273
274	export default edit;
275