Skip to content

Instantly share code, notes, and snippets.

@siata13

siata13/SPThemeService.ts

Last active Jan 15, 2019
Embed
What would you like to do?
import { SPHttpClient, SPHttpClientResponse } from "@microsoft/sp-http";
import { IPartialTheme } from "@uifabric/styling/lib";
export interface IThemingOptions {
'@odata.context': string;
hideDefaultThemes: boolean;
themePreviews: IThemePreview[];
}
export interface IThemePreview {
/**
* Name od the SP theme
*/
name: string;
/**
* JSON representing theme.
*/
themeJson: string;
}
export interface ISPThemeService {
addTheme(themeName: string, theme: IPartialTheme): Promise<boolean>;
getThemes(): Promise<IThemingOptions>;
deleteTheme(themeName: string): Promise<boolean>;
applyTheme(theme: IThemePreview, siteUrl: string): Promise<boolean>;
updateTheme(themeName: string, theme: IPartialTheme): Promise<boolean>
}
export class SPThemeService implements ISPThemeService {
private _siteUrl: string;
private _spHttpClient: SPHttpClient;
constructor(spHttpClient: SPHttpClient, siteUrl: string) {
this._spHttpClient = spHttpClient;
this._siteUrl = siteUrl;
}
/**
* Adds theme to the tenant.
* @param themeName Theme name.
* @param theme Theme partial definition containing palette property.
*/
public async addTheme(themeName: string, theme: IPartialTheme): Promise<boolean> {
try {
let url = `${this._siteUrl}/_api/thememanager/AddTenantTheme`;
const body = JSON.stringify({
name: themeName,
themeJson: JSON.stringify(theme)
});
let addThemeResponse: SPHttpClientResponse = await this._spHttpClient.post(url, SPHttpClient.configurations.v1, {
body: body
});
if (!addThemeResponse || !addThemeResponse.ok) {
throw new Error(`Something went wrong when add theme. ThemeName=${themeName}.`);
}
const addThemeJSONResult = await addThemeResponse.json();
if (!addThemeJSONResult) {
throw new Error(`Cannot read JSON result when add theme. ThemeName=${themeName}.`)
}
return addThemeJSONResult.value;
} catch (err) {
console.log(`[Error][SPThemeService.addTheme] : + ${err.message}`);
return false;
}
}
/**
* Gets available tenant themes.
* @param siteUrl Site URL which will be used to execute query.
*/
public async getThemes(): Promise<IThemingOptions> {
try {
let url = `${this._siteUrl}/_api/thememanager/GetTenantThemingOptions`;
let getThemesResponse: SPHttpClientResponse = await this._spHttpClient.get(url, SPHttpClient.configurations.v1);
if (!getThemesResponse || !getThemesResponse.ok) {
throw new Error(`Something went wrong when obtaining tenant themes.`);
}
const themesJSONResult = await getThemesResponse.json() as IThemingOptions;
if (!themesJSONResult) {
throw new Error("Cannot read JSON result when obtaining themes. ")
}
return themesJSONResult;
} catch (err) {
console.log(`[Error][SPThemeService.getThemes] : ${err.message}`);
return null;
}
}
/**
* Deletes theme.
* @param themeName Theme name to be deleted.
*/
public async deleteTheme(themeName: string): Promise<boolean> {
try {
let url = `${this._siteUrl}/_api/thememanager/DeleteTenantTheme`;
let deleteResult: SPHttpClientResponse = await this._spHttpClient.post(url, SPHttpClient.configurations.v1, {
body: JSON.stringify({
name: themeName
})
});
if (!deleteResult || !deleteResult.ok) {
throw new Error(`Something went wrong when delete theme. ThemeName=${themeName}.`);
}
return true;
} catch (err) {
console.log(`[Error][SPThemeService.deleteTheme] : ${err.message}`);
return false;
}
}
/**
* Apply theme to the site.
* @param theme Partial theme containing palette property.
* @param siteUrl
*/
public async applyTheme(theme: IThemePreview, siteUrl: string): Promise<boolean> {
try {
let url = `${siteUrl}/_api/ThemeManager/ApplyTheme`;
let applyThemeResult: SPHttpClientResponse = await this._spHttpClient.post(url, SPHttpClient.configurations.v1, {
body: JSON.stringify({
name: theme.name,
themeJson: theme.themeJson
})
});
if (!applyThemeResult || !applyThemeResult.ok) {
throw new Error("Something went wrong when applying theme.");
}
let applyThemeResultJson = await applyThemeResult.json();
if (!applyThemeResultJson) {
throw new Error("Cannot read answer when applying theme..");
}
return true;
} catch (err) {
console.log(`[Error][SPThemeService.applyTheme] : ${err.message}`);
return false;
}
}
/**
* Update theme.
* @param themeName Theme name to be updated.
* @param theme Partial theme containing palette property.
*/
public async updateTheme(themeName: string, theme: IPartialTheme): Promise<boolean> {
try {
let url = `${this._siteUrl}/_api/thememanager/UpdateTenantTheme`;
const body = JSON.stringify({
name: themeName,
themeJson: JSON.stringify(theme)
});
let updateThemeResponse: SPHttpClientResponse = await this._spHttpClient.post(url, SPHttpClient.configurations.v1, {
body: body
});
if (!updateThemeResponse || !updateThemeResponse.ok) {
throw new Error(`Something went wrong when update theme. ThemeName=${themeName}.`);
}
const updateThemeJSONResult = await updateThemeResponse.json();
if (!updateThemeJSONResult) {
throw new Error(`Cannot read JSON result when update theme. ThemeName=${themeName}.`)
}
return updateThemeJSONResult.value;
} catch (err) {
console.log(`[Error][SPThemeService.updateTheme] : ${err.message}`);
return false;
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.