To start using EmailJS on your website just paste the following code snippet before closing tag, with the correct user ID:
Then i have to import it in index.html file but there isn't a index.html can someone please help me
<script type="text/javascript"
src="https://cdn.jsdelivr.net/npm/emailjs-com#2/dist/email.min.js">
</script>
<script type="text/javascript">
(function(){
emailjs.init("YOUR_USER_ID");
})();
</script>
return (
<ProductProvider>
<div className="main-wrapper">
<Head>
<script type="text/javascript"
src="https://cdn.jsdelivr.net/npm/emailjs-com#2/dist/email.min.js">
</script>
<script type="text/javascript">
(function(){
emailjs.init("YOUR_USER_ID")
})();
</script>
</Head>
<BusinessTheme ThemeClass="demo1" />
</div>
</ProductProvider>
);
}
const DynamicComponentWithNoSSR = dynamic(
() => import('../node_modules/emailjs-com'),
{ ssr: false }
);
)
How do i find Email js file to import?
I am getting error that emailjs is undefined
Next.JS is 2 side running (Server and client sideded). You can install emailJs on dependency instead on cdn. (Maybe cause of occurrence emailJS undefined)
$ npm install emailjs-com --save
And if emailJS running on client side (javascript), u can use dynamic import on next js and disable ssr Dynamic Import NextJS.
Thanks
Related
I copied this code straightly from the official page of PayPal with correct client credentials. Here is my code:
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="Web site created using create-react-app"
/>
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<!--
manifest.json provides metadata used when your web app is installed on a
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
<script src="https://www.paypal.com/sdk/js?client-id=SECRET"></script>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>
YourComponent.js
import React from "react";
import ReactDOM from "react-dom"
const PayPalButton = paypal.Buttons.driver("react", { React, ReactDOM });
class YourComponent extends React.Component {
createOrder(data, actions) {
return actions.order.create({
purchase_units: [
{
amount: {
value: "135",
},
},
],
});
}
onApprove(data, actions) {
return actions.order.capture();
}
render() {
return (
<PayPalButton
createOrder={(data, actions) => this.createOrder(data, actions)}
onApprove={(data, actions) => this.onApprove(data, actions)}
/>
);
}
}
export default YourComponent;
App.js
import logo from './logo.svg';
import './App.css';
import YourComponent from './YourComponent';
function App() {
return (
<div className="App">
<YourComponent/>
</div>
);
}
export default App;
When I run it, it says PayPal at line 4:22 is not defined. I guess it is a silly error or might be my misunderstanding on the API too. Can anyone tell me what I can do?
https://www.paypal.com/sdk/js?client-id=SECRET
If you are actually using your REST App's API secret as part of the script src, that would be invalid. The REST App's client-id value must be passed here.
Load the app and check the browser's Developer Tools to make sure the script is actually being loaded successfully.
Instead of paypal.Buttons.driver you can try window.paypal.Buttons.driver
Alternatively, use the official react-paypal-js module instead.
Here I import from view file:
<script src='javascripts/tic-tac-toe/main.js'></script>
<link rel="stylesheet" type="text/css" href=stylesheets/tic-tac-toe/style.css'>
public folder structure:
[]
routes file:
GET /assets/*file controllers.Assets.versioned(path="/public", file: Asset)
When I try to access the view page I receive following error in firefox console and the files are not loaded :
The resource from
“http://localhost:9000/assets/stylesheets/tic-tac-toe/style.css'” was
blocked due to MIME type (“text/html”) mismatch
(X-Content-Type-Options: nosniff).
How to access js and css resources from view file ?
I can browse directly locally to the files on the browser via the address bar:
http://localhost:9000/assets/javascripts/tic-tac-toe/main.js
http://localhost:9000/assets/stylesheets/tic-tac-toe/style.css
Seems I need to prepend with "assets":
<script src='/assets/javascripts/tic-tac-toe/main.js'></script>
<link rel="stylesheet" type="text/css" href='/assets/stylesheets/tic-tac-toe/style.css'>
I have added a custom summary section to "Build Summary" section through a VSTS extension.
I'm getting following error in VSTS Build summary section on build completion.
"VSTS Extension by ABC failed to load.Learn More about this extension, including available support options."
Contribution:
"id": "abcfef-build-status-section",
"type": "ms.vss-build-web.build-results-section",
"description": "ABC Scan Summary",
"targets": [
".build-info-tab",
"ms.vss-build-web.build-results-summary-tab"
],
"properties": {
"name": "ABC Summary Section",
"uri": "buildstatus.html",
"order": 20,
"height": 500
}
Scope:
"scopes": [
"vso.build",
"vso.build_execute"
]
Html page (buildstatus.html):
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Hello World</title>
<script src="scripts/VSS.SDK.js"></script>
</head>
<body>
<script type="text/javascript">VSS.init();</script>
<h1>Hello World</h1>
<script type="text/javascript">VSS.notifyLoadSucceeded();</script>
</body>
</html>
Please help to resolve this.
Thanks in advance.
This is usually caused by the VSS.SDK.js file cannot be loaded when launching the extension, please check the things below:
The src path "scripts/VSS.SDK.js" in the html page is correct.
The src path and file is included in "files" section in "vss-extension.json" file.
I found the issue by analyzing console logs of Chrome browser. It seems my organization firewall is blocking the API call to retrieve resources. :)
https://xxxxxxxx.gallery.vsassets.io/_apis/public/gallery/publisher/xxxxxxxxxxxxxxxxxxxxxxxx=/Extension/status.html Failed to load resource: net::ERR_CONNECTION_CLOSED
Thanks-
It seems like this error may occur due to various reasons. In my case I forgot to include scripts folder into "files" in the manifest:
"files": [
{
"path": "scripts",
"addressable": true
}, ...
Hope someone will find it helpful.
As we know, there is an existing extension sample for Build Results Enhancer, and the source code can be found on GitHub: https://github.com/Microsoft/vsts-extension-samples/tree/master/build-results-enhancer
It seems there is nothing wrong with Contribution, you may focus on your Html page, and try to add usePlatformScripts: true in your HTML page to see whether the issue persists:
<head>
<title>Hello World</title>
</head>
<body>
<script src="scripts/VSS.SDK.js"></script>
<script type="text/javascript">
VSS.init({
usePlatformScripts: true
});
</script>
<h1>Hello World</h1>
</body>
</html>
I have a dart application using Polymer.dart, i replace the dart.js file by the boot.js (in my index.html), an now i want to deploy this application in order to have a working javascript one.
But, when i launch the build.dart, i have :
Total time spent on web/index.html -- 504 ms
Total time -- 555 ms
but nothing is created, no more "out" folder.
And when I do Pub Deploy, it create a "deploy" folder, but that version is not working (because the build.dart doesn't properly work i think).
Have you any idea?
Right now, it's a two step process. I suspect this will get easier. In the meantime:
Create a build.dart that looks like this:
import 'package:polymer/builder.dart';
main() {
build(entryPoints: ['web/index.html'], options: parseOptions(['--deploy']));
}
Take note, currently, a lot of warnings and hints are produced. You can ignore them for right now.
For the current version i have done these steps :
type on your console:
dart build.dart --deploy
dart2js out/web/index.html_bootstrap.dart -oout/web/index.html_bootstrap.dart.js
index.html:
<!DOCTYPE html>
<html>
<head>
...
<link rel="import" href="clickcounter.html">
<script type="application/dart">export 'package:polymer/init.dart';</script>
<script src="packages/browser/dart.js"></script>
</head>
<body>
...
<div id="sample_container_id">
<click-counter count="5"></click-counter>
</div>
</body>
</html>
build.dart:
import 'package:polymer/builder.dart';
main(args) {
build(entryPoints: ['web/aaa.html'],
options: parseOptions(args));
}
I am trying to improve my JBoss Portal dashboard using some analytical charting tools then I found VisiFire. So I started to investigate how I could deploy a simple VisiFire page as a portlet onto JBoss Portal dashboard. Below is what I did:
- I created a dummy portlet (display "Hello World" on the index page, index.html)
- Replaced the content of the index.html with a simple chart which would be rendered by VisiFire:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Visifire Charts</title>
<script language="javascript" type="text/javascript" >
</script>
</head>
<body>
<!-- To embed in existing html copy the code below -->
<script type="text/javascript" src="Visifire.js"></script>
<div id="VisifireChart">
<script language="javascript" type="text/javascript">
var chartXmlString = ''
+'<vc:Chart xmlns:vc="clr-namespace:Visifire.Charts;assembly=SLVisifire.Charts" Width="500" Height="300" BorderThickness="0" Theme="Theme1" ToolBarEnabled="True" >'
+'<vc:Chart.Titles>'
+'<vc:Title Text="Global Fortune 5 Companies 2007" />'
+'</vc:Chart.Titles>'
+'<vc:Chart.AxesX>'
+'<vc:Axis Title="Companies" />'
+'</vc:Chart.AxesX>'
+'<vc:Chart.AxesY>'
+'<vc:Axis Title="Revenue in Million dollars" AxisType="Primary" />'
+'</vc:Chart.AxesY>'
+'<vc:Chart.Series>'
+'<vc:DataSeries RenderAs="Column" AxisYType="Primary" >'
+'<vc:DataSeries.DataPoints>'
+'<vc:DataPoint AxisXLabel="Wall-Mart" YValue="351139" />'
+'<vc:DataPoint AxisXLabel="Exxon Mobil" YValue="345254" />'
+'<vc:DataPoint AxisXLabel="Shell" YValue="318845" />'
+'<vc:DataPoint AxisXLabel="BP" YValue="274316" />'
+'<vc:DataPoint AxisXLabel="General Motors" YValue="207349" />'
+'</vc:DataSeries.DataPoints>'
+'</vc:DataSeries>'
+'</vc:Chart.Series>'
+'</vc:Chart>';
var vChart = new Visifire("SL.Visifire.Charts.xap" , 500 , 300 );
vChart.setDataXml(chartXmlString);
vChart.render("VisifireChart");
</script>
</div>
<!-- Copy till here -->
</body>
</html>
I downloaded the VisiFire 3.6.1 Silverlight binaries and copied into the same directory as the index.html
I updated the web.xml with the MIME type:
xamlapplication/xaml+xml
xapapplication/x-silverlight-app
I deployed it onto my local JBoss AS, but the portlet is blank
I have been google around but could not find any useful information on how to deploy a portlet contains VisiFire Silverlight chart onto JBoss Portal. Have I don't anything stupidly unreasonable? Any hints or sample codes would be appreciated!
Thanks in advance
There is no "Silverlight" icon on the right click drop down menu.
I think JBoss is not allowing to download the file SL.Visifire.Charts.xap. Please check whether SL.Visifire.Charts.xap and Visifire.js are uploaded at correct directory. Also type the direct path of SL.Visifire.Charts.xap in address bar of the browser and try to download it.
Also try setting direct path like below
var vChart = new Visifire("http://www.example.com/SL.Visifire.Charts.xap" , 500 , 300 );
Can you please check whether you are able to see Silverlight on right click.