@mikezimm/npmfunctions
Version:
Functions used in my SPFx webparts
274 lines • 17.9 kB
JavaScript
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
if (typeof b !== "function" && b !== null)
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
var desc = Object.getOwnPropertyDescriptor(m, k);
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
desc = { enumerable: true, get: function() { return m[k]; } };
}
Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
__setModuleDefault(result, mod);
return result;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var React = __importStar(require("react"));
var Icon_1 = require("office-ui-fabric-react/lib/Icon");
var sp_core_library_1 = require("@microsoft/sp-core-library");
/***
* d88888b d8888b. .d8888. d8888b. d8888b. d88888b .d8888. d88888b d888888b .d8888.
* 88' 88 `8D 88' YP 88 `8D 88 `8D 88' 88' YP 88' `~~88~~' 88' YP
* 88ooo 88oodD' `8bo. 88oodD' 88oobY' 88ooooo `8bo. 88ooooo 88 `8bo.
* 88~~~ 88~~~ `Y8b. 88~~~ 88`8b 88~~~~~ `Y8b. 88~~~~~ 88 `Y8b.
* 88 88 db 8D 88 88 `88. 88. db 8D 88. 88 db 8D
* YP 88 `8888Y' 88 88 YD Y88888P `8888Y' Y88888P YP `8888Y'
*
*
*/
var component_1 = __importDefault(require("../banner/onLocal/component"));
// import { FPSPinMe, IPinMeState, getDefaultFPSPinState, IPinStatus } from '../fpsReferences';
var FPSPinMenu_1 = require("../../Services/DOM/PinMe/FPSPinMenu");
// import { getWebPartHelpElement } from './PropPaneHelp';
// import { getBannerPages } from '../components/HelpPanel/AllContent';
/***
* db .d88b. .o88b. .d8b. db
* 88 .8P Y8. d8P Y8 d8' `8b 88
* 88 88 88 8P 88ooo88 88
* 88 88 88 8b 88~~~88 88
* 88booo. `8b d8' Y8b d8 88 88 88booo.
* Y88888P `Y88P' `Y88P' YP YP Y88888P
*
*
*/
//Use this to add more console.logs for this component
var consoleFunctions = true;
var FetchBanner = /** @class */ (function (_super) {
__extends(FetchBanner, _super);
/***
* .o88b. .d88b. d8b db .d8888. d888888b d8888b. db db .o88b. d888888b .d88b. d8888b.
* d8P Y8 .8P Y8. 888o 88 88' YP `~~88~~' 88 `8D 88 88 d8P Y8 `~~88~~' .8P Y8. 88 `8D
* 8P 88 88 88V8o 88 `8bo. 88 88oobY' 88 88 8P 88 88 88 88oobY'
* 8b 88 88 88 V8o88 `Y8b. 88 88`8b 88 88 8b 88 88 88 88`8b
* Y8b d8 `8b d8' 88 V888 db 8D 88 88 `88. 88b d88 Y8b d8 88 `8b d8' 88 `88.
* `Y88P' `Y88P' VP V8P `8888Y' YP 88 YD ~Y8888P' `Y88P' YP `Y88P' 88 YD
*
*
*/
function FetchBanner(props) {
var _this = _super.call(this, props) || this;
_this.pimMeCmdStyles = null;
// private makeExpandPropsCmdStyles( withLeftMargin: boolean ) {
// const propsCmdCSS: React.CSSProperties = JSON.parse(JSON.stringify( this.props.parentProps.bannerProps.bannerCmdReactCSS ));
// propsCmdCSS.backgroundColor = 'transparent';
// if ( withLeftMargin === true ) propsCmdCSS.marginLeft = '30px';
// propsCmdCSS.color = null; //Make sure icon is always visible
// return propsCmdCSS;
// }
/***
* d8b db d88888b .d8b. d8888b. d88888b .d8b. d8888b. d88888b db d88888b
* 888o 88 88' d8' `8b 88 `8D 88' d8' `8b 88 `8D 88' 88 88'
* 88V8o 88 88ooooo 88ooo88 88oobY' 88ooo 88ooo88 88oobY' 88ooooo 88 88ooooo
* 88 V8o88 88~~~~~ 88~~~88 88`8b 88~~~ 88~~~88 88`8b 88~~~~~ 88 88~~~~~
* 88 V888 88. 88 88 88 `88. 88 88 88 88 `88. 88. 88booo. 88.
* VP V8P Y88888P YP YP 88 YD YP YP YP 88 YD Y88888P Y88888P Y88888P
*
*
*/
// private WebPartHelpElement = getWebPartHelpElement( this.props.parentProps.sitePresets );
// private contentPages : IBannerPages = getBannerPages( this.props.parentProps.bannerProps );
_this.nearBannerElements = _this.buildNearBannerElements();
if (consoleFunctions === true)
console.log('FetchBannerElement ~ constructor');
_this.state = {
// pinState: this.props.pinState,
};
return _this;
}
// private baseCmdStyles: React.CSSProperties = createBannerStyleObj( 'corpDark1', 'cmd' );
FetchBanner.prototype.makeLargerCmdStyles = function () {
var smaller = JSON.parse(JSON.stringify(this.props.parentProps.bannerProps.bannerCmdReactCSS));
smaller.fontSize = 'larger';
smaller.marginRight = '';
return smaller;
};
FetchBanner.prototype.buildNearBannerElements = function () {
var elements = this.props.nearBannerElementsArray ? this.props.nearBannerElementsArray : [];
// defaultBannerCommandStyles.fontWeight = 'bolder';
// elements.push(<div style={{ paddingRight: null }} className={ '' } title={ title}>
// <Icon iconName='WindDirection' onClick={ this.jumpToParentSite.bind(this) } style={ defaultBannerCommandStyles }/>
// </div>);
return elements;
};
FetchBanner.prototype.buildFarBannerElements = function () {
var farElements = this.props.farBannerElementsArray ? this.props.farBannerElementsArray : [];
if (this.props.parentProps.bannerProps.showTricks === true) {
farElements.push(null);
}
return farElements;
};
FetchBanner.prototype.componentDidMount = function () {
if (consoleFunctions === true)
console.log('FetchBannerElement ~ componentDidMount');
this.pimMeCmdStyles = this.makeLargerCmdStyles();
//Copied from FPSPageInfo.tsx componentDidMount
var _a = this.props.parentProps, displayMode = _a.displayMode, fpsPinMenu = _a.fpsPinMenu;
var tempPinState = displayMode === sp_core_library_1.DisplayMode.Edit ? 'normal' : this.props.pinState;
(0, FPSPinMenu_1.FPSPinMe)(fpsPinMenu.domElement, tempPinState, null, false, true, null, fpsPinMenu.pageLayout, displayMode);
};
//
/***
* d8888b. d888888b d8888b. db db d8888b. d8888b. .d8b. d888888b d88888b
* 88 `8D `88' 88 `8D 88 88 88 `8D 88 `8D d8' `8b `~~88~~' 88'
* 88 88 88 88 88 88 88 88oodD' 88 88 88ooo88 88 88ooooo
* 88 88 88 88 88 88 88 88~~~ 88 88 88~~~88 88 88~~~~~
* 88 .8D .88. 88 .8D 88b d88 88 88 .8D 88 88 88 88.
* Y8888D' Y888888P Y8888D' ~Y8888P' 88 Y8888D' YP YP YP Y88888P
*
*
*/
FetchBanner.prototype.componentDidUpdate = function (prevProps) {
if (consoleFunctions === true)
console.log('FetchBannerElement ~ componentDidUpdate');
var _a = this.props.parentProps, displayMode = _a.displayMode, fpsPinMenu = _a.fpsPinMenu;
var pinStatus = (0, FPSPinMenu_1.getDefaultFPSPinState)(prevProps.parentProps.fpsPinMenu, fpsPinMenu, displayMode);
this.pimMeCmdStyles = this.makeLargerCmdStyles();
var refresh = false;
if (pinStatus.refresh === true) {
(0, FPSPinMenu_1.FPSPinMe)(fpsPinMenu.domElement, pinStatus.defPinState, null, false, true, null, fpsPinMenu.pageLayout, displayMode);
}
if (JSON.stringify(prevProps.panelPerformance) !== JSON.stringify(this.props.panelPerformance)) {
refresh = true;
}
else if (prevProps.bonusHTML1 !== this.props.bonusHTML1) {
refresh = true;
}
else if (prevProps.bonusHTML2 !== this.props.bonusHTML2) {
refresh = true;
}
else if (typeof prevProps.appendTitle !== typeof this.props.appendTitle) {
refresh = true;
}
else if (typeof prevProps.appendTitle === 'string' && typeof this.props.appendTitle === 'string' && prevProps.appendTitle && this.props.appendTitle) {
refresh = true;
}
return refresh;
};
FetchBanner.prototype.render = function () {
if (consoleFunctions === true)
console.log('FetchBannerElement ~ render');
var bannerProps = this.props.parentProps.bannerProps;
var _a = this.props.parentProps, displayMode = _a.displayMode, fpsPinMenu = _a.fpsPinMenu;
// const farBannerElementsArray = [];
var farBannerElementsArray = this.buildFarBannerElements();
// private FeedbackIcon = <Icon title={ 'Submit Feedback' } iconName='Feedback' onClick={ this.sendFeedback.bind(this) } style={ this.makeExpandPropsCmdStyles( false ) }/>;
var PinDefault = React.createElement(Icon_1.Icon, { title: 'Set to default', iconName: 'ArrowDownRightMirrored8', onClick: this.setPinDefault.bind(this), style: this.pimMeCmdStyles });
//If there is no updatePinState function, then the web part does not use it so ignore this code.
if (this.props.updatePinState) {
if (fpsPinMenu.forcePinState !== true && this.props.pinState === 'normal') {
var PinFullIcon = React.createElement(Icon_1.Icon, { title: 'Pin to top', iconName: 'Pinned', onClick: this.setPinFull.bind(this), style: this.pimMeCmdStyles });
farBannerElementsArray.push(PinFullIcon);
}
else if (this.props.pinState === 'pinFull') {
var PinMinIcon = React.createElement(Icon_1.Icon, { title: 'Minimize', iconName: 'CollapseMenu', onClick: this.setPinMin.bind(this), style: this.pimMeCmdStyles });
farBannerElementsArray.push(PinMinIcon);
if (fpsPinMenu.forcePinState !== true)
farBannerElementsArray.push(PinDefault);
}
else if (this.props.pinState === 'pinMini') {
var PinExpandIcon = React.createElement(Icon_1.Icon, { title: 'Expand', iconName: 'DoubleChevronDown', onClick: this.setPinFull.bind(this), style: this.pimMeCmdStyles });
farBannerElementsArray.push(PinExpandIcon);
if (fpsPinMenu.forcePinState !== true)
farBannerElementsArray.push(PinDefault);
}
}
var bannerSuffix = '';
//Exclude the props.bannerProps.title if the webpart is narrow to make more responsive
var bannerTitle = bannerProps.bannerWidth < 900 ? bannerProps.title : "".concat(bannerProps.title, " ").concat((bannerSuffix ? ' - ' + bannerSuffix : ''));
if (bannerTitle === '') {
bannerTitle = 'ignore';
}
if (displayMode === sp_core_library_1.DisplayMode.Edit) {
bannerTitle += '';
}
/***
* d8888b. .d8b. d8b db d8b db d88888b d8888b. d88888b db d88888b .88b d88. d88888b d8b db d888888b
* 88 `8D d8' `8b 888o 88 888o 88 88' 88 `8D 88' 88 88' 88'YbdP`88 88' 888o 88 `~~88~~'
* 88oooY' 88ooo88 88V8o 88 88V8o 88 88ooooo 88oobY' 88ooooo 88 88ooooo 88 88 88 88ooooo 88V8o 88 88
* 88~~~b. 88~~~88 88 V8o88 88 V8o88 88~~~~~ 88`8b 88~~~~~ 88 88~~~~~ 88 88 88 88~~~~~ 88 V8o88 88
* 88 8D 88 88 88 V888 88 V888 88. 88 `88. 88. 88booo. 88. 88 88 88 88. 88 V888 88
* Y8888P' YP YP VP V8P VP V8P Y88888P 88 YD Y88888P Y88888P Y88888P YP YP YP Y88888P VP V8P YP
*
*
*/
var forceNarrowStyles = this.props.pinState === 'pinFull' || this.props.pinState === 'pinMini' ? true : false;
//If there is no updatePinState function, then the web part does not use it so ignore this code.
if (!this.props.updatePinState) {
forceNarrowStyles = false;
}
return (React.createElement(component_1.default
//If refreshId={ this.props.parentState.refreshId } -- causes React minified error #85
, {
//If refreshId={ this.props.parentState.refreshId } -- causes React minified error #85
refreshId: this.props.refreshId ? this.props.refreshId : '', displayMode: bannerProps.displayMode, WebPartHelpElement: this.props.WebPartHelpElement, SpecialMessage: this.props.SpecialMessage, forceNarrowStyles: forceNarrowStyles, contentPages: this.props.contentPages, feedbackEmail: bannerProps.feedbackEmail, FPSUser: bannerProps.FPSUser, exportProps: bannerProps.exportProps, showBanner: bannerProps.showBanner,
// Adding this to adjust expected width for when prop pane could be opened
bannerWidth: (bannerProps.bannerWidth), pageContext: bannerProps.pageContext, pageLayout: bannerProps.pageLayout, title: bannerTitle, appendTitle: this.props.appendTitle, panelTitle: bannerProps.panelTitle, infoElement: bannerProps.infoElement, bannerReactCSS: bannerProps.bannerReactCSS, bannerCmdReactCSS: bannerProps.bannerCmdReactCSS, showTricks: bannerProps.showTricks, showGoToParent: bannerProps.showGoToParent, showGoToHome: bannerProps.showGoToHome, onHomePage: bannerProps.onHomePage, webpartHistory: bannerProps.webpartHistory, showBannerGear: bannerProps.showBannerGear, showFullPanel: bannerProps.showFullPanel, replacePanelHTML: this.props.replacePanelHTML ? this.props.replacePanelHTML : bannerProps.replacePanelHTML, bonusHTML1: this.props.bonusHTML1 ? this.props.bonusHTML1 : null, panelPerformance: this.props.panelPerformance ? this.props.panelPerformance : null, bonusHTML2: this.props.bonusHTML2 ? this.props.bonusHTML2 : null, replacePanelWarning: bannerProps.replacePanelWarning, hoverEffect: bannerProps.hoverEffect, gitHubRepo: bannerProps.gitHubRepo, earyAccess: bannerProps.earyAccess, wideToggle: bannerProps.wideToggle, nearElements: this.nearBannerElements, farElements: farBannerElementsArray, showRepoLinks: bannerProps.showRepoLinks, showExport: bannerProps.showExport,
//2022-02-17: Added these for expandoramic mode
domElement: bannerProps.domElement, enableExpandoramic: bannerProps.enableExpandoramic, expandoDefault: bannerProps.expandoDefault, expandoStyle: bannerProps.expandoStyle, expandAlert: bannerProps.expandAlert, expandConsole: bannerProps.expandConsole, expandoPadding: bannerProps.expandoPadding, beAUser: bannerProps.beAUser, showBeAUserIcon: bannerProps.showBeAUserIcon, beAUserFunction: bannerProps.beAUserFunction }));
};
FetchBanner.prototype.setPinFull = function () {
if (consoleFunctions === true)
console.log('FetchBannerElement ~ setPinFull');
var _a = this.props.parentProps, displayMode = _a.displayMode, fpsPinMenu = _a.fpsPinMenu;
(0, FPSPinMenu_1.FPSPinMe)(fpsPinMenu.domElement, 'pinFull', null, false, true, null, fpsPinMenu.pageLayout, displayMode);
if (this.props.updatePinState)
this.props.updatePinState('pinFull');
};
FetchBanner.prototype.setPinMin = function () {
if (consoleFunctions === true)
console.log('FetchBannerElement ~ setPinMin');
var _a = this.props.parentProps, displayMode = _a.displayMode, fpsPinMenu = _a.fpsPinMenu;
(0, FPSPinMenu_1.FPSPinMe)(fpsPinMenu.domElement, 'pinMini', null, false, true, null, fpsPinMenu.pageLayout, displayMode);
if (this.props.updatePinState)
this.props.updatePinState('pinMini');
};
FetchBanner.prototype.setPinDefault = function () {
if (consoleFunctions === true)
console.log('FetchBannerElement ~ setPinDefault');
var _a = this.props.parentProps, displayMode = _a.displayMode, fpsPinMenu = _a.fpsPinMenu;
(0, FPSPinMenu_1.FPSPinMe)(fpsPinMenu.domElement, 'normal', null, false, true, null, fpsPinMenu.pageLayout, displayMode);
if (this.props.updatePinState)
this.props.updatePinState('normal');
};
return FetchBanner;
}(React.Component));
exports.default = FetchBanner;
//# sourceMappingURL=FetchBannerElement.js.map