Upraded to SPFx 1.10.0
This commit is contained in:
Hugo Bernier
parent
3546b6c4af
commit
4f41b8a2c4
|
|
@ -2,10 +2,10 @@
|
|||
"@microsoft/generator-sharepoint": {
|
||||
"isCreatingSolution": true,
|
||||
"environment": "spo",
|
||||
"version": "1.7.1",
|
||||
"version": "1.10.0",
|
||||
"libraryName": "js-theme-manager",
|
||||
"libraryId": "555147fb-b773-446f-aef2-1b25001f92d9",
|
||||
"packageManager": "npm",
|
||||
"componentType": "webpart"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@ NOTE: This is a great option to provide theme management of a Site Collection wi
|
|||
|
||||
|
||||
## Used SharePoint Framework Version
|
||||
|
||||
|
||||
|
||||
## Applies to
|
||||
|
||||
|
|
@ -38,7 +38,8 @@ NOTE: This is a great option to provide theme management of a Site Collection wi
|
|||
|
||||
Solution|Author(s)
|
||||
--------|---------
|
||||
js-theme-manager | David Warner II ([@DavidWarnerII](https://twitter.com/davidwarnerii) / [Warner Digital](http://warner.digital))
|
||||
js-theme-manager (Upgrade) | Hugo Bernier ([@bernierh](https://twitter.com/bernierh) / [Tahoe Ninjas](https://tahoeninjas.blog))
|
||||
js-theme-manager | Beau Cameron ([@Beau__Cameron](https://twitter.com/@Beau__Cameron) / [Blog](https://beaucameron.net/))
|
||||
js-theme-manager | Beau Cameron ([@Beau__Cameron](https://twitter.com/@Beau__Cameron) / [Blog](https://beaucameron.net/))
|
||||
|
||||
## Version history
|
||||
|
|
@ -46,6 +47,7 @@ js-theme-manager | Beau Cameron ([@Beau__Cameron](https://twitter.com/@Beau__Cam
|
|||
Version|Date|Comments
|
||||
-------|----|--------
|
||||
1.0|February 27, 2019|Initial release
|
||||
2.0|June 1, 2020|Upgraded to SPFx 1.10.0
|
||||
|
||||
## Disclaimer
|
||||
**THIS CODE IS PROVIDED *AS IS* WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.**
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
"solution": {
|
||||
"name": "js-theme-manager-client-side-solution",
|
||||
"id": "555147fb-b773-446f-aef2-1b25001f92d9",
|
||||
"version": "1.0.0.0",
|
||||
"version": "2.0.0.0",
|
||||
"includeClientSideAssets": true
|
||||
},
|
||||
"paths": {
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,6 +1,7 @@
|
|||
{
|
||||
"name": "js-theme-manager",
|
||||
"version": "0.0.1",
|
||||
"main": "lib/index.js",
|
||||
"version": "2.0.0",
|
||||
"private": true,
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
|
|
@ -11,21 +12,23 @@
|
|||
"test": "gulp test"
|
||||
},
|
||||
"dependencies": {
|
||||
"@microsoft/sp-core-library": "1.7.1",
|
||||
"@microsoft/sp-webpart-base": "1.7.1",
|
||||
"@microsoft/sp-lodash-subset": "1.7.1",
|
||||
"@microsoft/sp-office-ui-fabric-core": "1.7.1",
|
||||
"@types/webpack-env": "1.13.1",
|
||||
"@types/es6-promise": "0.0.33"
|
||||
"@microsoft/sp-core-library": "1.10.0",
|
||||
"@microsoft/sp-lodash-subset": "1.10.0",
|
||||
"@microsoft/sp-office-ui-fabric-core": "1.10.0",
|
||||
"@microsoft/sp-property-pane": "1.10.0",
|
||||
"@microsoft/sp-webpart-base": "1.10.0",
|
||||
"@types/es6-promise": "0.0.33",
|
||||
"@types/webpack-env": "1.13.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@microsoft/sp-build-web": "1.7.1",
|
||||
"@microsoft/sp-tslint-rules": "1.7.1",
|
||||
"@microsoft/sp-module-interfaces": "1.7.1",
|
||||
"@microsoft/sp-webpart-workbench": "1.7.1",
|
||||
"gulp": "~3.9.1",
|
||||
"@microsoft/rush-stack-compiler-3.3": "0.3.5",
|
||||
"@microsoft/sp-build-web": "1.10.0",
|
||||
"@microsoft/sp-module-interfaces": "1.10.0",
|
||||
"@microsoft/sp-tslint-rules": "1.10.0",
|
||||
"@microsoft/sp-webpart-workbench": "1.10.0",
|
||||
"@types/chai": "3.4.34",
|
||||
"@types/mocha": "2.2.38",
|
||||
"ajv": "~5.2.2"
|
||||
"ajv": "~5.2.2",
|
||||
"gulp": "~3.9.1"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,21 +4,17 @@
|
|||
"alias": "ModernThemeManagerWebPart",
|
||||
"componentType": "WebPart",
|
||||
|
||||
// The "*" signifies that the version should be taken from the package.json
|
||||
"version": "*",
|
||||
"manifestVersion": 2,
|
||||
|
||||
// If true, the component can only be installed on sites where Custom Script is allowed.
|
||||
// Components that allow authors to embed arbitrary script code should set this to true.
|
||||
// https://support.office.com/en-us/article/Turn-scripting-capabilities-on-or-off-1f2c515f-5d7e-448a-9fd7-835da935584f
|
||||
"requiresCustomScript": false,
|
||||
|
||||
"supportedHosts": ["SharePointWebPart"],
|
||||
"preconfiguredEntries": [{
|
||||
"groupId": "5c03119e-3074-46fd-976b-c60198311f70", // Other
|
||||
"group": { "default": "Other" },
|
||||
"title": { "default": "Modern Theme Manager" },
|
||||
"description": { "default": "Modern Theme Manager description" },
|
||||
"officeFabricIconFontName": "Page",
|
||||
"officeFabricIconFontName": "Color",
|
||||
"properties": {
|
||||
"description": "Modern Theme Manager"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,9 +1,6 @@
|
|||
import { Version } from '@microsoft/sp-core-library';
|
||||
import {
|
||||
BaseClientSideWebPart,
|
||||
IPropertyPaneConfiguration,
|
||||
PropertyPaneTextField
|
||||
} from '@microsoft/sp-webpart-base';
|
||||
import { BaseClientSideWebPart } from "@microsoft/sp-webpart-base";
|
||||
import { IPropertyPaneConfiguration, PropertyPaneTextField } from "@microsoft/sp-property-pane";
|
||||
import { escape } from '@microsoft/sp-lodash-subset';
|
||||
|
||||
import styles from './ModernThemeManagerWebPart.module.scss';
|
||||
|
|
@ -30,7 +27,7 @@ export default class ModernThemeManagerWebPart extends BaseClientSideWebPart<IMo
|
|||
</a>
|
||||
|
||||
<div>
|
||||
<p class="${ styles.subTitle}">Theme Actions</p>
|
||||
<p class="${ styles.subTitle}">Theme Actions</p>
|
||||
<label class="${ styles.radio}"><input type="radio" name="themeAction" value="create"> Create a theme</label>
|
||||
<label class="${ styles.radio}"><input type="radio" name="themeAction" value="update"> Update a theme</label>
|
||||
<label class="${ styles.radio}"><input type="radio" name="themeAction" value="delete"> Delete a theme</label>
|
||||
|
|
@ -38,12 +35,12 @@ export default class ModernThemeManagerWebPart extends BaseClientSideWebPart<IMo
|
|||
</div>
|
||||
|
||||
<div class="${ styles.hide} ${styles.genericWrapper}" id="${styles.themeSelectWrapper}">
|
||||
<p class="${ styles.subTitle}">Available Themes</p>
|
||||
<p class="${ styles.subTitle}">Available Themes</p>
|
||||
<select id="${ styles.availableThemesSelect}" name="availableThemes">
|
||||
</select>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="${ styles.hide} ${styles.genericWrapper}" id="${styles.themeNameWrapper}">
|
||||
<p class="${ styles.subTitle}">Theme Name</p>
|
||||
<div>
|
||||
|
|
@ -84,7 +81,7 @@ export default class ModernThemeManagerWebPart extends BaseClientSideWebPart<IMo
|
|||
this.setupClickEvent();
|
||||
}
|
||||
|
||||
/***** *****
|
||||
/***** *****
|
||||
Create event listeners for Radio & Buttons
|
||||
***** *****/
|
||||
public setupClickEvent(): void {
|
||||
|
|
@ -118,15 +115,11 @@ export default class ModernThemeManagerWebPart extends BaseClientSideWebPart<IMo
|
|||
else if (selectedValue == 'apply') {
|
||||
parent.displayApplyOptions();
|
||||
}
|
||||
|
||||
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
/***** *****
|
||||
/***** *****
|
||||
Hide All Wrappers:
|
||||
Generic method for hiding all of the form elements
|
||||
***** *****/
|
||||
|
|
@ -148,7 +141,7 @@ public hideAllWrappers(): void {
|
|||
|
||||
}
|
||||
|
||||
/***** *****
|
||||
/***** *****
|
||||
Display Update Options:
|
||||
This method is used to display the form elements for the Theme Update Options.
|
||||
***** *****/
|
||||
|
|
@ -163,12 +156,11 @@ public displayUpdateOptions(): void {
|
|||
document.getElementById(styles.themePaletteWrapper).classList.remove(styles.hide);
|
||||
document.getElementById('updateTheme').classList.remove(styles.hide);
|
||||
}
|
||||
})
|
||||
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/***** *****
|
||||
/***** *****
|
||||
Display Create Options:
|
||||
This method is used to display the form elements for the Theme Creation Options.
|
||||
***** *****/
|
||||
|
|
@ -181,11 +173,9 @@ public displayCreateOptions(): void {
|
|||
document.getElementById(styles.themeNameWrapper).classList.remove(styles.hide);
|
||||
document.getElementById(styles.themePaletteWrapper).classList.remove(styles.hide);
|
||||
document.getElementById('createTheme').classList.remove(styles.hide);
|
||||
|
||||
|
||||
}
|
||||
|
||||
/***** *****
|
||||
/***** *****
|
||||
Display Delete Options:
|
||||
This method is used to display the form elements for the Theme Deletion Options.
|
||||
***** *****/
|
||||
|
|
@ -202,7 +192,7 @@ public displayDeleteOptions(): void {
|
|||
});
|
||||
}
|
||||
|
||||
/***** *****
|
||||
/***** *****
|
||||
Display Apply Options:
|
||||
This method is used to display the form elements for the Theme Apply Options.
|
||||
***** *****/
|
||||
|
|
@ -217,7 +207,7 @@ public displayApplyOptions(): void {
|
|||
document.getElementById('applyTheme').classList.remove(styles.hide);
|
||||
}
|
||||
|
||||
/***** *****
|
||||
/***** *****
|
||||
Populate Existing Themes:
|
||||
This method retrieves the currently available themes in the tenant and inserts the values into the dropdown.
|
||||
***** *****/
|
||||
|
|
@ -243,7 +233,7 @@ public populateExistingThemes(url, params): Promise<boolean> {
|
|||
|
||||
}
|
||||
|
||||
/***** *****
|
||||
/***** *****
|
||||
Create new theme at tenant level:
|
||||
Collects the data needed to create a new theme at the tenant level and passes it to the creation execution method.
|
||||
***** *****/
|
||||
|
|
@ -273,7 +263,7 @@ public createTheme(): void {
|
|||
|
||||
|
||||
|
||||
/***** *****
|
||||
/***** *****
|
||||
Deletes a theme at tenant level:
|
||||
Collects the data needed to delete a theme at the tenant level and passes it to the deletion execution method.
|
||||
***** *****/
|
||||
|
|
@ -300,7 +290,7 @@ public deleteTheme(): void {
|
|||
});
|
||||
}
|
||||
|
||||
/***** *****
|
||||
/***** *****
|
||||
Updates a theme at tenant level:
|
||||
Collects the data needed to update a theme at the tenant level and passes it to the update execution method.
|
||||
***** *****/
|
||||
|
|
@ -311,7 +301,7 @@ public updateTheme(): void {
|
|||
let themePalette: JSON = JSON.parse((<HTMLInputElement>document.getElementById(styles.textarea)).value);
|
||||
let themePaletteJSON = {
|
||||
"palette": themePalette
|
||||
}
|
||||
};
|
||||
|
||||
// Pass the theme properties to themeManagerExecution method
|
||||
this.themeManagerExecution(this.context.pageContext.site.serverRelativeUrl + "/_api/thememanager/UpdateTenantTheme", { name: themeTitle, themeJson: JSON.stringify(themePaletteJSON) })
|
||||
|
|
@ -328,7 +318,7 @@ public updateTheme(): void {
|
|||
}
|
||||
|
||||
|
||||
/***** *****
|
||||
/***** *****
|
||||
Apply a theme to a site collection:
|
||||
Collects the data needed to apply a theme directly to a site colleciton.
|
||||
NOTE: This does NOT create a theme choice at the tenant level. It will directly apply the theme to a site collection.
|
||||
|
|
@ -341,7 +331,7 @@ public applyThemeNew(): void {
|
|||
let themePalette: JSON = JSON.parse((<HTMLInputElement>document.getElementById(styles.textarea)).value);
|
||||
let themePaletteJSON = {
|
||||
"palette": themePalette
|
||||
}
|
||||
};
|
||||
|
||||
const digestCache: IDigestCache = this.context.serviceScope.consume(DigestCache.serviceKey);
|
||||
digestCache.fetchDigest(themeURL).then((digest: string): void => {
|
||||
|
|
@ -363,18 +353,18 @@ public applyThemeNew(): void {
|
|||
|
||||
}
|
||||
|
||||
/***** *****
|
||||
/***** *****
|
||||
Generic method for creating, updating, deleting and applying a theme.
|
||||
***** *****/
|
||||
public themeManagerExecution(url: string, params: any): Promise<boolean> {
|
||||
|
||||
let options: ISPHttpClientOptions = {
|
||||
body: JSON.stringify(params)
|
||||
}
|
||||
};
|
||||
|
||||
return this.context.spHttpClient.post(url, SPHttpClient.configurations.v1, options)
|
||||
.then((response: SPHttpClientResponse) => {
|
||||
return response.ok
|
||||
return response.ok;
|
||||
});
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,9 @@
|
|||
{
|
||||
"extends": "./node_modules/@microsoft/rush-stack-compiler-3.3/includes/tsconfig-web.json",
|
||||
"compilerOptions": {
|
||||
"noUnusedLocals": false,
|
||||
"strictNullChecks": false,
|
||||
"inlineSources": false,
|
||||
"target": "es5",
|
||||
"forceConsistentCasingInFileNames": true,
|
||||
"module": "esnext",
|
||||
|
|
|
|||
Loading…
Reference in New Issue