← All changes | blocks/style-handler/style-handler.js +269 -0 0.2.5.7 → 3.3.3 View file →

		@@ -1,0 +1,269 @@
	1	+//Generate Styles
	2	+(() => {
	3	+ /**
	4	+ * WordPress Dependencies
	5	+ */
	6	+ const { select, subscribe } = wp.data;
	7	+ const { isFunction } = lodash;
	8	+ const { parse, isReusableBlock, isTemplatePart } = wp.blocks;
	9	+ const { editor_type } = nx_style_handler;
	10	+
	11	+ const makeIdOfTemplatePart = (theme, slug) =>
	12	+ theme && slug ? theme + "//" + slug : null;
	13	+ const emptyFuns = () => {};
	14	+
	15	+ let ebEditGetPreviewDeviceType = false;
	16	+
	17	+ if (editor_type === "edit-site") {
	18	+ //
	19	+ ebEditGetPreviewDeviceType = select("core/edit-site")
	20	+ .__experimentalGetPreviewDeviceType;
	21	+ } else if (editor_type === "edit-post") {
	22	+ //
	23	+ ebEditGetPreviewDeviceType = select("core/edit-post")
	24	+ .__experimentalGetPreviewDeviceType;
	25	+ }
	26	+
	27	+ window.ebEditCurrentPreviewOption = ebEditGetPreviewDeviceType();
	28	+
	29	+ const {
	30	+ isSavingPost = emptyFuns,
	31	+ isAutosavingPost = emptyFuns,
	32	+ isSavingNonPostEntityChanges = emptyFuns,
	33	+ } = select("core/editor");
	34	+
	35	+ const regexForBlockNameTest = /^notificationx\-pro\//g;
	36	+
	37	+ // Flag to prevent multiple calls during save process
	38	+ let isSendingStyles = false;
	39	+ let lastSaveState = false;
	40	+
	41	+ //
	42	+ const generateAndSendStyleToBackend = () => {
	43	+ // Prevent multiple calls during the same save operation
	44	+ if (isSendingStyles) {
	45	+ return;
	46	+ }
	47	+
	48	+ const { getCurrentPostType = emptyFuns } = select("core/editor");
	49	+ const currentPostType = getCurrentPostType();
	50	+
	51	+ // Only proceed if post type is 'nx_bar_eb'
	52	+ if (currentPostType !== 'nx_bar_eb') {
	53	+ return;
	54	+ }
	55	+
	56	+ isSendingStyles = true;
	57	+ const { getEditedEntityRecord = emptyFuns } = select("core");
	58	+ const { getBlocks = emptyFuns } = select("core/block-editor");
	59	+ const { getCurrentPostId = emptyFuns } = select("core/editor");
	60	+ const post_id = getCurrentPostId();
	61	+ const all_blocks = getBlocks();
	62	+
	63	+ const styles = {};
	64	+ const cssObjectMaker = (blocks) => {
	65	+ for (const item of blocks) {
	66	+ const {
	67	+ attributes: { blockMeta, blockRoot, blockId },
	68	+ innerBlocks,
	69	+ } = item;
	70	+ if (isFunction(isReusableBlock) && isReusableBlock(item)) {
	71	+ const reusableBlock = getEditedEntityRecord(
	72	+ "postType",
	73	+ "wp_block",
	74	+ item.attributes.ref
	75	+ );
	76	+ const parsedBlocks = !isEmpty(reusableBlock)
	77	+ ? parse(
	78	+ isFunction(reusableBlock.content)
	79	+ ? reusableBlock.content(reusableBlock)
	80	+ : reusableBlock.content
	81	+ )
	82	+ : false;
	83	+
	84	+ if (parsedBlocks) {
	85	+ for (const blockItem of parsedBlocks) {
	86	+ const {
	87	+ attributes: { blockMeta, blockRoot, blockId },
	88	+ innerBlocks,
	89	+ } = blockItem;
	90	+ if (blockMeta && blockRoot === "notificationx_pro") {
	91	+ styles[blockId] = blockMeta;
	92	+ }
	93	+ if (innerBlocks.length > 0) {
	94	+ cssObjectMaker(innerBlocks);
	95	+ }
	96	+ }
	97	+ }
	98	+ } else if (isFunction(isTemplatePart) && isTemplatePart(item)) {
	99	+ const { theme, slug } = item.attributes;
	100	+
	101	+ const templatePartEntity = getEditedEntityRecord(
	102	+ "postType",
	103	+ "wp_template_part",
	104	+ makeIdOfTemplatePart(theme, slug)
	105	+ );
	106	+
	107	+ const { blocks = [], innerBlocks = [] } = templatePartEntity;
	108	+ cssObjectMaker(blocks);
	109	+ cssObjectMaker(innerBlocks);
	110	+ } else if (blockMeta && blockRoot === "notificationx_pro") {
	111	+ styles[blockId] = blockMeta;
	112	+ }
	113	+ if (innerBlocks.length > 0) {
	114	+ cssObjectMaker(innerBlocks);
	115	+ }
	116	+ }
	117	+ };
	118	+
	119	+ cssObjectMaker(all_blocks); // Call function
	120	+
	121	+ const stringStyles = JSON.stringify(styles);
	122	+
	123	+ jQuery.ajax({
	124	+ type: "POST",
	125	+ url: ajaxurl,
	126	+ data: {
	127	+ data: stringStyles,
	128	+ id: post_id,
	129	+ editorType: editor_type,
	130	+ action: "notificationx_pro_write_block_css",
	131	+ nonce: nx_style_handler.sth_nonce,
	132	+ },
	133	+ success: function (response) {
	134	+ // Reset flag on successful completion
	135	+ isSendingStyles = false;
	136	+ },
	137	+ error: function (msg) {
	138	+ console.log(msg);
	139	+ // Reset flag on error as well
	140	+ isSendingStyles = false;
	141	+ },
	142	+ });
	143	+ };
	144	+
	145	+ const callBackFuncOnPreviewChange = () => {
	146	+ if (window.ebEditCurrentPreviewOption !== ebEditGetPreviewDeviceType()) {
	147	+ const newDeviceType = ebEditGetPreviewDeviceType();
	148	+
	149	+ // the following line of code should be at the top of this if statement
	150	+ window.ebEditCurrentPreviewOption = newDeviceType;
	151	+
	152	+ //
	153	+ const { isFunction } = lodash;
	154	+ const {
	155	+ parse = emptyFuns,
	156	+ isReusableBlock = emptyFuns,
	157	+ isTemplatePart = emptyFuns,
	158	+ } = wp.blocks;
	159	+ const { getEditedEntityRecord = emptyFuns } = select("core");
	160	+ const {
	161	+ getBlocks = emptyFuns,
	162	+ updateBlockAttributes = emptyFuns,
	163	+ } = select("core/block-editor");
	164	+
	165	+ const all_blocks = getBlocks();
	166	+
	167	+ const resOptionChanger = (blocks) => {
	168	+ for (const item of blocks) {
	169	+ const { name, clientId, innerBlocks } = item;
	170	+
	171	+ if (isFunction(isReusableBlock) && isReusableBlock(item)) {
	172	+ const reusableBlock = getEditedEntityRecord(
	173	+ "postType",
	174	+ "wp_block",
	175	+ item.attributes.ref
	176	+ );
	177	+
	178	+ const parsedBlocks = parse(
	179	+ isFunction(reusableBlock.content)
	180	+ ? reusableBlock.content(reusableBlock)
	181	+ : reusableBlock.content
	182	+ );
	183	+
	184	+ for (const blockItem of parsedBlocks) {
	185	+ const { innerBlocks, clientId, name } = blockItem;
	186	+ if (regexForBlockNameTest.test(name)) {
	187	+ updateBlockAttributes(clientId, {
	188	+ resOption: newDeviceType,
	189	+ });
	190	+ }
	191	+ if (innerBlocks.length > 0) {
	192	+ resOptionChanger(innerBlocks);
	193	+ }
	194	+ }
	195	+ } else if (isFunction(isTemplatePart) && isTemplatePart(item)) {
	196	+ const { theme, slug } = item.attributes;
	197	+
	198	+ const templatePartEntity = getEditedEntityRecord(
	199	+ "postType",
	200	+ "wp_template_part",
	201	+ makeIdOfTemplatePart(theme, slug)
	202	+ );
	203	+
	204	+ const { blocks = [], innerBlocks = [] } = templatePartEntity;
	205	+ resOptionChanger(blocks);
	206	+ resOptionChanger(innerBlocks);
	207	+ } else if (regexForBlockNameTest.test(name)) {
	208	+ updateBlockAttributes(clientId, {
	209	+ resOption: newDeviceType,
	210	+ });
	211	+ }
	212	+ if (innerBlocks.length > 0) {
	213	+ resOptionChanger(innerBlocks);
	214	+ }
	215	+ }
	216	+ };
	217	+
	218	+ resOptionChanger(all_blocks); // Call function
	219	+ }
	220	+ };
	221	+
	222	+ //
	223	+ const callBackFuncForSubsCribeForEditPost = () => {
	224	+ const currentSaveState = isSavingPost() && !isAutosavingPost();
	225	+
	226	+ // Only call when starting to save (transition from false to true)
	227	+ if (currentSaveState && !lastSaveState) {
	228	+ generateAndSendStyleToBackend();
	229	+ }
	230	+
	231	+ // Reset flag when save is complete (transition from true to false)
	232	+ if (!currentSaveState && lastSaveState) {
	233	+ isSendingStyles = false;
	234	+ }
	235	+
	236	+ lastSaveState = currentSaveState;
	237	+ callBackFuncOnPreviewChange();
	238	+ };
	239	+
	240	+ const callBackFuncForSubsCribeForEditSite = () => {
	241	+ const currentSaveState = isSavingNonPostEntityChanges();
	242	+
	243	+ // Only call when starting to save (transition from false to true)
	244	+ if (currentSaveState && !lastSaveState) {
	245	+ generateAndSendStyleToBackend();
	246	+ }
	247	+
	248	+ // Reset flag when save is complete (transition from true to false)
	249	+ if (!currentSaveState && lastSaveState) {
	250	+ isSendingStyles = false;
	251	+ }
	252	+
	253	+ lastSaveState = currentSaveState;
	254	+ callBackFuncOnPreviewChange();
	255	+ };
	256	+
	257	+ if (editor_type === "edit-site") {
	258	+ //
	259	+ subscribe(callBackFuncForSubsCribeForEditSite);
	260	+ } else if (editor_type === "edit-post") {
	261	+ //
	262	+ subscribe(callBackFuncForSubsCribeForEditPost);
	263	+ }
	264	+})();
	265	+
	266	+//Helper Functions
	267	+function isEmpty(obj) {
	268	+ return Object.keys(obj).length === 0;
	269	+}