honeymoose/sp-dev-fx-webparts
1
0
Fork 0
mirror of https://github.com/pnp/sp-dev-fx-webparts.git synced 2025-03-30 11:59:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

Browse Source 
Updated to support script inside a tag
Updated tradeview sample
This commit is contained in:
Mikael Svenson 2020-06-22 14:16:12 +02:00
parent 3dd0ee134c
commit 1fe2cd381b
3 changed files with 44 additions and 41 deletions
samples
react-script-editor-onprem
README.md
src/webparts/scriptEditor
ScriptEditorWebPart.ts
react-script-editor
README.md

40
samples/react-script-editor-onprem/README.md

@ -31,26 +31,28 @@ As an example add the following scripts to the web part in order to show stock t
```html ```html
<!-- TradingView Widget BEGIN --> <!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container"> <div class="tradingview-widget-container">
<div id="tradingview_ab4e5"></div> <div id="tradingview_e7aa0"></div>
<div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/NASDAQ-MSFT/" rel="noopener" target="_blank"><span class="blue-text">MSFT chart</span></a> by TradingView</div> <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/NASDAQ-AAPL/" rel="noopener" target="_blank"><span class="blue-text">AAPL Chart</span></a> by TradingView</div>
<script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>
<script type="text/javascript">
new TradingView.widget(
{
"width": 980,
"height": 610,
"symbol": "NASDAQ:AAPL",
"interval": "D",
"timezone": "Etc/UTC",
"theme": "light",
"style": "1",
"locale": "en",
"toolbar_bg": "#f1f3f6",
"enable_publishing": false,
"allow_symbol_change": true,
"container_id": "tradingview_e7aa0"
}
);
</script>
</div> </div>
<script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>
<script type="text/javascript">
new TradingView.widget({
"width": 400,
"height": 200,
"symbol": "NASDAQ:MSFT",
"interval": "D",
"timezone": "Etc/UTC",
"theme": "Light",
"style": "1",
"locale": "en",
"toolbar_bg": "#f1f3f6",
"enable_publishing": false,
"allow_symbol_change": true,
"container_id": "tradingview_ab4e5"
});
</script>
<!-- TradingView Widget END --> <!-- TradingView Widget END -->
``` ```

5
samples/react-script-editor-onprem/src/webparts/scriptEditor/ScriptEditorWebPart.ts

@ -140,12 +140,11 @@ export default class ScriptEditorWebPart extends BaseClientSideWebPart<IScriptEd
// main section of function // main section of function
const scripts = []; const scripts = [];
const children_nodes = element.childNodes; const children_nodes = element.getElementsByTagName("script");
for (let i = 0; children_nodes[i]; i++) { for (let i = 0; children_nodes[i]; i++) {
const child: any = children_nodes[i]; const child: any = children_nodes[i];
if (this.nodeName(child, "script") && if (!child.type || child.type.toLowerCase() === "text/javascript") {
(!child.type || child.type.toLowerCase() === "text/javascript")) {
scripts.push(child); scripts.push(child);
} }
} }

40
samples/react-script-editor/README.md

@ -29,26 +29,28 @@ As an example add the following scripts to the web part in order to show stock t
```html ```html
<!-- TradingView Widget BEGIN --> <!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container"> <div class="tradingview-widget-container">
<div id="tradingview_ab4e5"></div> <div id="tradingview_e7aa0"></div>
<div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/NASDAQ-MSFT/" rel="noopener" target="_blank"><span class="blue-text">MSFT chart</span></a> by TradingView</div> <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/NASDAQ-AAPL/" rel="noopener" target="_blank"><span class="blue-text">AAPL Chart</span></a> by TradingView</div>
<script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>
<script type="text/javascript">
new TradingView.widget(
{
"width": 980,
"height": 610,
"symbol": "NASDAQ:AAPL",
"interval": "D",
"timezone": "Etc/UTC",
"theme": "light",
"style": "1",
"locale": "en",
"toolbar_bg": "#f1f3f6",
"enable_publishing": false,
"allow_symbol_change": true,
"container_id": "tradingview_e7aa0"
}
);
</script>
</div> </div>
<script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>
<script type="text/javascript">
new TradingView.widget({
"width": 400,
"height": 200,
"symbol": "NASDAQ:MSFT",
"interval": "D",
"timezone": "Etc/UTC",
"theme": "Light",
"style": "1",
"locale": "en",
"toolbar_bg": "#f1f3f6",
"enable_publishing": false,
"allow_symbol_change": true,
"container_id": "tradingview_ab4e5"
});
</script>
<!-- TradingView Widget END --> <!-- TradingView Widget END -->
``` ```