@speechkit/speechkit-audio-player
Version:
A web player component that can play audio from https://speechkit.io
151 lines (143 loc) • 5.06 kB
HTML
<html>
<head>
<meta charset="utf-8">
<title>Speechkit example</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
/* margin-left: 4rem; */
}
</style>
<script src="https://browser.sentry-cdn.com/5.5.0/bundle.min.js" crossorigin="anonymous"></script>
<script>
Sentry.init({ dsn: 'https://dd66cf0c863044aab89c1bf54b38c690@sentry.io/1501570' });
Sentry.setTag("environment", "dev");
</script>
</head>
<body style="height: 2000px;">
<div id="app" class="app">
<div id="speechkit-player"></div>
</div>
<script src="./speechkit-player.js"></script>
<!--<script src="./data.js"></script>-->
<script>
function getParameterByName(name, url) {
if (!url) url = window.location.href;
name = name.replace(/[\[\]]/g, "\\$&");
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, " "));
}
var podcast = {
'id': '42c1d379-5ca1-4265-912b-4fc4001f1310',
'podcast_id': 28704,
'url': 'https://staging-app.speechkit.io',
'title': 'A world-changing event just happened at the UN. But the UK government has\ngiven it the middle finger.',
'author': 'Sapar Kurmanov',
'summary': 'A world-changing event just happened at the UN. But the UK government has\ngiven it the middle finger....',
'image': null,
'published_at': '2018-11-12T15:42:19.507Z',
'body': 'A world-changing event just happened at the UN. But the UK government has\ngiven it the middle finger.',
'state': 'processed',
'share_url': 'https://staging.spkt.io/a/28704',
'share_version': 'v2',
'media': [{
'id': 66050,
'role': 'body',
'content_type': 'audio/mpeg',
'url': 'https://speechkit-staging.s3.amazonaws.com/audio/projects/102/podcasts/28704/media/c680eb6dd7f8f5b2e7c911b0dc3475a2_compiled.mp3',
'created_at': '2018-11-12T15:42:31.181Z',
'updated_at': '2018-11-12T15:42:32.252Z',
'state': 'processed',
'duration': 13.348571,
'voice': { 'id': 39, 'language': 'en_GB', 'name': 'Brian' },
}],
'player_type': 'EmbeddedPlayer',
'next_podcast_external_id': null,
}
var articleUrl = getParameterByName('articleUrl');
var player = getParameterByName('ampPlayer') || "MinimalPlayer" || getParameterByName('player') || 'MinimalPlayer';
var isAmp = !!getParameterByName('isAmp');
// Resolve articleurl if no podcast and if not passed
if (!podcast && !articleUrl) {
articleUrl = document.referrer
if (document.referrer.indexOf('https://m.nettavisen.no') !== -1) {
articleUrl = document.referrer.replace('https://m.', 'https://www.')
}
if (document.referrer.indexOf('http://testm.standaard.be') !== -1) {
articleUrl = document.referrer.replace("http://testm", "http://test")
}
}
// const customAdMedia = {
// "id":86,
// "campaign_name":"test title",
// "campaign_id":45,
// "project_id":2090,
// "updated_at":"2019-08-08T19:33:16.681Z",
// "media":[
// {
// "id":75,
// "title":"test title",
// "content_type":"audio/mpeg",
// "logo":null,
// "url":"https://speechkit-staging.s3.amazonaws.com/ads/campaigns/45/audios/75/303ae34667e72a6465ecde96ea29e54f.mp3",
// "promo_link":"http://tests.com",
// "created_at":"2019-08-08T19:30:03.031Z",
// "updated_at":"2019-08-08T19:30:08.304Z",
// "state":"processed",
// "duration":1.08
// }
// ]
// };
const customAdMedia = {
"id":75,
"campaign_name":"123",
"campaign_id":45,
"project_id":464,
"updated_at":"2019-08-08T19:33:16.681Z",
"media":[
{
"id":75,
"title":"qqqq",
"content_type":"audio/mpeg",
"logo":null,
"url":"https://speechkit-staging.s3.amazonaws.com/ads/campaigns/45/audios/75/303ae34667e72a6465ecde96ea29e54f.mp3",
"promo_link":"https://google1.com",
"created_at":"2019-08-08T19:30:03.031Z",
"updated_at":"2019-08-08T19:30:08.304Z",
"state":"processed",
"duration":108
}
]
};
// Run SK
new SpeechKit.players({
player: player,
skBackend: "https://staging.spkt.io",
renderNode: 'speechkit-player',
apiKey: "write_383e47b4fa412e405d8b80f997970cab",
projectId: "2090",
// projectCampaignId: "86",
customAdMedia: customAdMedia,
podcastUrl: "http://saparjohnick@000webhostapp.com",
publisherId: "54",
publisher: "Medi",
publisherLogo: "",
publisherColor: "#FF0000",
// language: "ru_RU",
podcast: podcast,
articleUrl: articleUrl,
feedbackUrl: "https://staging.spkt.io/rate/basic",
message: "",
isAmp: isAmp,
withDownloadButton: true
}).then(function(currentPlayer) {
currentPlayer.load();
});
</script>
</body>
</html>