From b9760f384564efc9cf097ebfe116fad82ea5c5d8 Mon Sep 17 00:00:00 2001 From: Paul Schaeflein Date: Sun, 5 Apr 2020 23:32:59 -0500 Subject: [PATCH] Add properties for template url & data url --- .../AdaptiveCardHostWebPart.ts | 133 ++++++++++++++++-- .../webparts/adaptiveCardHost/loc/en-us.js | 6 + .../adaptiveCardHost/loc/mystrings.d.ts | 6 + 3 files changed, 131 insertions(+), 14 deletions(-) diff --git a/samples/react-adaptivecards/src/webparts/adaptiveCardHost/AdaptiveCardHostWebPart.ts b/samples/react-adaptivecards/src/webparts/adaptiveCardHost/AdaptiveCardHostWebPart.ts index 1e6b53bf0..004503c78 100644 --- a/samples/react-adaptivecards/src/webparts/adaptiveCardHost/AdaptiveCardHostWebPart.ts +++ b/samples/react-adaptivecards/src/webparts/adaptiveCardHost/AdaptiveCardHostWebPart.ts @@ -3,12 +3,14 @@ import * as ReactDom from 'react-dom'; import { Version } from '@microsoft/sp-core-library'; import { BaseClientSideWebPart } from '@microsoft/sp-webpart-base'; import { DisplayMode } from '@microsoft/sp-core-library'; +import { HttpClient, HttpClientConfiguration, HttpClientResponse } from '@microsoft/sp-http'; // Used for property pane import { IPropertyPaneConfiguration, PropertyPaneChoiceGroup, - PropertyPaneToggle + PropertyPaneToggle, + PropertyPaneTextField } from '@microsoft/sp-property-pane'; // Used to select which list @@ -40,15 +42,25 @@ import * as strings from 'AdaptiveCardHostWebPartStrings'; import AdaptiveCardHost from './components/AdaptiveCardHost'; import { IAdaptiveCardHostProps } from './components/IAdaptiveCardHostProps'; - -export type DataSourceType = 'list' | 'json'; +export type TemplateSourceType = 'json' | 'url'; +export type DataSourceType = 'list' | 'json' | 'url'; export interface IAdaptiveCardHostWebPartProps { + /** + * Either 'json' or 'url' + */ + templateSource: TemplateSourceType; + /** * The JSON Adaptive Cards template */ template: string; + /** + * The URL to the template json + */ + templateUrl: string; + /** * The static JSON data, if using */ @@ -60,7 +72,7 @@ export interface IAdaptiveCardHostWebPartProps { useTemplating: boolean; /** - * Either 'list' or 'json' + * Either 'list' or 'json' or 'url' */ dataSource: DataSourceType; @@ -73,6 +85,11 @@ export interface IAdaptiveCardHostWebPartProps { * The view id of the selected view */ view: string | undefined; + + /** + * The url of the remote data + */ + dataUrl: string | undefined; } export default class AdaptiveCardHostWebPart extends BaseClientSideWebPart { @@ -82,6 +99,7 @@ export default class AdaptiveCardHostWebPart extends BaseClientSideWebPart { @@ -100,12 +118,17 @@ export default class AdaptiveCardHostWebPart extends BaseClientSideWebPart { const { template } = this.properties; - const dataJson: string = this.properties.dataSource === 'list' && this.properties.list && this.properties.view ? this._dataJSON : this.properties.data; + const templateJson: string = this.properties.templateSource === 'url' && this.properties.templateUrl ? this._templateJSON: this.properties.template; + + const dataJson: string = (this.properties.dataSource === 'list' && this.properties.list && this.properties.view) || + (this.properties.dataSource === 'url' && this.properties.dataUrl) ? this._dataJSON : this.properties.data; // The Adaptive Card control does not care where the template and data are coming from. // Pass a valid template JSON and -- if using -- some data JSON @@ -113,7 +136,7 @@ export default class AdaptiveCardHostWebPart extends BaseClientSideWebPart { + // There is no need to load data if the url is not configured + if (this.properties.dataSource !== 'url' || !this.properties.dataUrl) { + return; + } + + this.context.httpClient.get(this.properties.dataUrl, HttpClient.configurations.v1) + .then((response: HttpClientResponse) => { + if (response.ok) { + response.json() + .then((data: any) => { + this._dataJSON = JSON.stringify(data); + }); + } + }); + } + + private async _loadTemplateFromUrl(): Promise { + if (this.properties.templateSource !== 'url' || !this.properties.templateUrl) { + return; + } + + this.context.httpClient.get(this.properties.templateUrl, HttpClient.configurations.v1) + .then((response: HttpClientResponse) => { + if (response.ok) { + response.json() + .then((data: any) => { + this._templateJSON = JSON.stringify(data); + }); + } + }); + + } } diff --git a/samples/react-adaptivecards/src/webparts/adaptiveCardHost/loc/en-us.js b/samples/react-adaptivecards/src/webparts/adaptiveCardHost/loc/en-us.js index eedecfd7f..f5f2b5bdd 100644 --- a/samples/react-adaptivecards/src/webparts/adaptiveCardHost/loc/en-us.js +++ b/samples/react-adaptivecards/src/webparts/adaptiveCardHost/loc/en-us.js @@ -8,8 +8,14 @@ define([], function () { DataNeededDescription: "When you use Adaptive Card Templating, you need to provide either static JSON data, or from a SharePoint list.", DataNeededIconText: "You need data!", ListFieldLabel: "Select a list", + DataUrlLabel: "Data source URL", + TemplateSourceFieldLabel: "Template source", + TemplateSourceFieldChoiceJSON: "JSON", + TemplateSourceFieldChoiceUrl: "URL", + TemplateUrlLabel: "Template url", DataSourceFieldChoiceList: "List", DataSourceFieldChoiceJSON: "JSON", + DataSourceFieldChoiceUrl: "URL", DataSourceFieldLabel: "Data source", ViewPropertyFieldLabel: "Select a view", TemplateJsonError: "Invalid template JSON: ", diff --git a/samples/react-adaptivecards/src/webparts/adaptiveCardHost/loc/mystrings.d.ts b/samples/react-adaptivecards/src/webparts/adaptiveCardHost/loc/mystrings.d.ts index 52f1dc448..8aab3818d 100644 --- a/samples/react-adaptivecards/src/webparts/adaptiveCardHost/loc/mystrings.d.ts +++ b/samples/react-adaptivecards/src/webparts/adaptiveCardHost/loc/mystrings.d.ts @@ -7,8 +7,14 @@ declare interface IAdaptiveCardHostWebPartStrings { DataNeededDescription: string; DataNeededIconText: string; ListFieldLabel: string; + DataUrlLabel: string; + TemplateSourceFieldLabel: string; + TemplateSourceFieldChoiceJSON: string; + TemplateSourceFieldChoiceUrl: string; + TemplateUrlLabel: string; DataSourceFieldChoiceList: string; DataSourceFieldChoiceJSON: string; + DataSourceFieldChoiceUrl: string; DataSourceFieldLabel: string; ViewPropertyFieldLabel: string; TemplateJsonError: string;