@mikezimm/fps-library-v2
Version:
Library of reusable typescript/javascript functions, interfaces and constants
138 lines (136 loc) • 7.13 kB
JavaScript
/**
* CodeAnalizerComment: Updated 5 imports on 2024-09-22 14:49:52
* Update:: import { createFPSWindowProps } to '@mikezimm/fps-core-v7/lib/banner/features/FPSDOM/FPSDocument;'
* Update:: import { initializeFPSSection } to '@mikezimm/fps-core-v7/lib/banner/features/FPSDOM/FPSDocument;'
* Update:: import { IFPSWindowProps } to '@mikezimm/fps-core-v7/lib/banner/features/FPSDOM/IFPSWindowProps;'
* Update:: import { IFPSSectionStyle } to '@mikezimm/fps-core-v7/lib/banner/features/FPSDOM/IFPSSection;'
* Update:: import { IMinWPBannerProps } to '@mikezimm/fps-core-v7/lib/banner/interfaces/MinWP/IMinWPBannerProps;'
*/
/**
* CodeAnalizerComment: Updated 6 imports on 2024-09-21 23:07:24
* Update:: import { createFPSWindowProps } to '@mikezimm/fps-core-v7/lib/banner/features/FPSDOM/FPSDocument;'
* Update:: import { initializeFPSSection } to '@mikezimm/fps-core-v7/lib/banner/features/FPSDOM/FPSDocument;'
* Update:: import { IFPSWindowProps } to '@mikezimm/fps-core-v7/lib/banner/features/FPSDOM/IFPSWindowProps;'
* Update:: import { IFPSSectionStyle } to '@mikezimm/fps-core-v7/lib/banner/features/FPSDOM/IFPSSection;'
* Update:: import { IMinWPBannerProps } to '@mikezimm/fps-core-v7/lib/banner/interfaces/MinWP/IMinWPBannerProps;'
* Update:: import { check4This } to '@mikezimm/fps-core-v7/lib/logic/Links/CheckSearch;'
*/
import { createFPSWindowProps, initializeFPSSection, } from '@mikezimm/fps-core-v7/lib/banner/features/FPSDOM/FPSDocument';
import { sendStandardConsole, sendFPSWindowConsole } from './console';
import { check4This, Check4 } from '@mikezimm/fps-core-v7/lib/logic/Links/CheckSearch';
import { findElementWithViewportId } from '@mikezimm/fps-core-v7/lib/logic/DOM/Search/tagParentSection';
/**
* Combined updateSectionStyles and setSectionStyles
*/
export function updateSectionStyles(wpInstanceID, wpProps, fpsid) {
if (check4This(Check4.skipStyleChanges_Eq_true) === true) {
console.log(`${Check4.skipStyleChanges_Eq_true} @ updateSectionStyles`);
return;
}
let allSectionMaxWidth = wpProps.allSectionMaxWidthEnable !== true ? null : wpProps.allSectionMaxWidth;
let allSectionMargin = wpProps.allSectionMarginEnable !== true ? null : wpProps.allSectionMargin;
let sectionStyles = initializeFPSSection(wpInstanceID, allSectionMaxWidth, allSectionMargin);
const alertError = true;
const consoleResult = true;
let fpsWindowProps = createFPSWindowProps();
let winMaxWidthStyle = fpsWindowProps.sections.maxWidth;
let winMarginTBStyle = fpsWindowProps.sections.marginTB;
//Check if everything was already attempted
let proceed = false;
if (sectionStyles.maxWidth.do === true && winMaxWidthStyle.success === 0) {
proceed = true;
}
else if (sectionStyles.marginTB.do === true && winMarginTBStyle.success === 0) {
proceed = true;
}
if (proceed === false) {
return;
}
/**
* Was getting this ts error creating divs:
* Type 'NodeListOf<Element>' is missing the following properties from type 'any[]': pop, push, concat, join, and 26 more.ts(2740)
*
* Found this reference: https://stackoverflow.com/a/222847
* which references this: https://262.ecma-international.org/8.0/#sec-array.from
*
* Which now removes the error
*/
const divs = Array.from(document.querySelectorAll('[data-automation-id="CanvasSection"]'));
if (check4This(Check4.fpsInitRender_Eq_true) === true)
console.log("divs.length: ", divs.length);
//inspiration from: https://reactgo.com/select-element-data-attribute-js/
let maxWidthStyle = sectionStyles.maxWidth;
let marginTBStyle = sectionStyles.marginTB;
let check4PageTitle = true; // https://github.com/mikezimm/pivottiles7/issues/391
divs.forEach((el) => {
// https://github.com/mikezimm/pivottiles7/issues/391
// added skipSection and check4PageTitle loop to avoid changing width on default page title sections
let skipSection = false;
if (check4PageTitle === true) {
const TitleElement = findElementWithViewportId(`WebPart.PageTitle.internal`, el);
if (TitleElement) {
skipSection = true;
check4PageTitle = false;
}
}
// https://github.com/mikezimm/pivottiles7/issues/391
if (skipSection === true)
return;
// Test if any children elements have a data-viewport-id beginning with 'WebPart.PageTitle.internal...' and skip those sections
try {
//This updates section maxWidth: As of 2022-02-08: default = '1256px'
if (maxWidthStyle.do === true) {
fpsWindowProps.sections.maxWidth = applySectionStyle(el.parentNode, maxWidthStyle, winMaxWidthStyle, alertError, consoleResult);
}
//This updates section top and bottom margin: As of 2022-02-08: default = '24px 0'
if (marginTBStyle.do === true) {
fpsWindowProps.sections.marginTB = applySectionStyle(el.childNodes[0], marginTBStyle, winMarginTBStyle, alertError, consoleResult);
}
sectionStyles.summary.success++;
}
catch (e) {
if (alertError === true) {
alert('updateSectionStyles: Could not find element with data-automation-id="CanvasSection"');
}
console.log('updateSectionStyles: Could not find element with data-automation-id="CanvasSection"');
sectionStyles.summary.errors++;
fpsWindowProps.sections.summary.errors++;
}
});
sendFPSWindowConsole(true, 'COMPLETE', fpsWindowProps);
return { sectionStyles };
}
export function applySectionStyle(el, targetStyle, windowStyle, alertError = true, consoleResult = false) {
let cssProp = targetStyle.cssProp;
windowStyle.do = true;
//Needed to get instanceId this way to prevent mutation
const thisInstanceId = targetStyle.wpInstanceID + '';
windowStyle.wpInstanceID = thisInstanceId;
windowStyle.history.push(thisInstanceId);
try {
if (el.style) {
if (windowStyle.original === 'tbd') {
windowStyle.original = el.style[cssProp];
}
el.style[cssProp] = targetStyle.value;
}
else {
if (windowStyle.original === 'tbd') {
windowStyle.original = null;
}
el.style = {};
el.style[cssProp] = targetStyle.value;
windowStyle.value = targetStyle.value;
}
windowStyle.success++;
windowStyle.attempted = true;
sendStandardConsole(check4This(Check4.fpsInitRender_Eq_true), 'SUCCESS', windowStyle);
}
catch (e) {
windowStyle.errors++;
windowStyle.attempted = true;
sendStandardConsole(check4This(Check4.fpsInitRender_Eq_true), 'FAILURE', windowStyle);
}
return windowStyle;
}
//# sourceMappingURL=setAllSectionStyles.js.map