Skip to content
Snippets Groups Projects
Commit 0a506deb authored by David Trattnig's avatar David Trattnig
Browse files

Read data from track-service API.

parent e8ddbaf4
No related branches found
No related tags found
No related merge requests found
Expand all Hide whitespace changes
Inline Side-by-side
Showing
with 15547 additions and 43 deletions
contrib/aura-player/README.md
+ 13
− 2
View file @ 0a506deb
# Aura Player
A collection of JavaScript components to integrate Aura to your Website.
Provided components:
- Track Service
## Requirements
Node 13
## Install ## Install
npn install npn install
## Run ## Run
npm start npm start
\ No newline at end of file \ No newline at end of file
contrib/aura-player/package-lock.json 0 → 100644
+ 2290
− 0
View file @ 0a506deb
This diff is collapsed.
contrib/aura-player/package.json
+ 4
− 4
View file @ 0a506deb
{ {
"name": "aura-player", "name": "aura-player-app",
"version": "1.0.0", "version": "1.0.0",
"scripts": { "scripts": {
"build": "rollup -c", "build": "rollup -c",
...@@ -7,9 +7,9 @@ ...@@ -7,9 +7,9 @@
"start": "sirv public" "start": "sirv public"
}, },
"devDependencies": { "devDependencies": {
"@rollup/plugin-commonjs": "^11.0.0", "@rollup/plugin-node-resolve": "^6.0.0",
"@rollup/plugin-node-resolve": "^7.0.0", "rollup": "^1.12.0",
"rollup": "^1.20.0", "rollup-plugin-commonjs": "^10.0.0",
"rollup-plugin-livereload": "^1.0.0", "rollup-plugin-livereload": "^1.0.0",
"rollup-plugin-svelte": "^5.0.3", "rollup-plugin-svelte": "^5.0.3",
"rollup-plugin-terser": "^5.1.2", "rollup-plugin-terser": "^5.1.2",
......
contrib/aura-player/public/bootstrap.bundle.js 0 → 100644
+ 6328
− 0
View file @ 0a506deb
This diff is collapsed.
contrib/aura-player/public/bootstrap.css 0 → 100644
+ 6841
− 0
View file @ 0a506deb
This diff is collapsed.
contrib/aura-player/public/global.css
+ 2
− 0
View file @ 0a506deb
...@@ -2,6 +2,8 @@ html, body { ...@@ -2,6 +2,8 @@ html, body {
position: relative; position: relative;
width: 100%; width: 100%;
height: 100%; height: 100%;
margin: 0;
padding: 0;
} }
body { body {
......
contrib/aura-player/public/index.html
+ 2
− 3
View file @ 0a506deb
...@@ -7,13 +7,12 @@ ...@@ -7,13 +7,12 @@
<title>Svelte app</title> <title>Svelte app</title>
<link rel='icon' type='image/png' href='/favicon.png'> <link rel='icon' type='image/png' href='/favicon.png'>
<link rel='stylesheet' href='/global.css'> <link rel="stylesheet" href="/bootstrap.css">
<!--<link rel='stylesheet' href='/global.css'>-->
<link rel='stylesheet' href='/build/bundle.css'> <link rel='stylesheet' href='/build/bundle.css'>
<script defer src='/build/bundle.js'></script> <script defer src='/build/bundle.js'></script>
</head> </head>
<body> <body>
asdfdasf
</body> </body>
</html> </html>
contrib/aura-player/rollup.config.js
+ 6
− 6
View file @ 0a506deb
import svelte from 'rollup-plugin-svelte'; import svelte from 'rollup-plugin-svelte';
import resolve from '@rollup/plugin-node-resolve'; import resolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs'; import commonjs from 'rollup-plugin-commonjs';
import livereload from 'rollup-plugin-livereload'; import livereload from 'rollup-plugin-livereload';
import { terser } from 'rollup-plugin-terser'; import { terser } from 'rollup-plugin-terser';
...@@ -19,7 +19,7 @@ export default { ...@@ -19,7 +19,7 @@ export default {
// enable run-time checks when not in production // enable run-time checks when not in production
dev: !production, dev: !production,
// we'll extract any component CSS out into // we'll extract any component CSS out into
// a separate file - better for performance // a separate file — better for performance
css: css => { css: css => {
css.write('public/build/bundle.css'); css.write('public/build/bundle.css');
} }
...@@ -27,12 +27,12 @@ export default { ...@@ -27,12 +27,12 @@ export default {
// If you have external dependencies installed from // If you have external dependencies installed from
// npm, you'll most likely need these plugins. In // npm, you'll most likely need these plugins. In
// some cases you'll need additional configuration - // some cases you'll need additional configuration —
// consult the documentation for details: // consult the documentation for details:
// https://github.com/rollup/plugins/tree/master/packages/commonjs // https://github.com/rollup/rollup-plugin-commonjs
resolve({ resolve({
browser: true, browser: true,
dedupe: ['svelte'] dedupe: importee => importee === 'svelte' || importee.startsWith('svelte/')
}), }),
commonjs(), commonjs(),
...@@ -68,4 +68,4 @@ function serve() { ...@@ -68,4 +68,4 @@ function serve() {
} }
} }
}; };
} }
\ No newline at end of file
contrib/aura-player/src/App.svelte
+ 50
− 24
View file @ 0a506deb
<script> <script>
export let name; import TrackService from './TrackService.svelte';
</script>
<main> let query = "trackservice/3";
<h1>Hello {name}!</h1> let result;
<p>Visit the <a href="https://svelte.dev/tutorial">Svelte tutorial</a> to learn how to build Svelte apps.</p>
</main>
<style>
main {
text-align: center;
padding: 1em;
max-width: 240px;
margin: 0 auto;
}
h1 { async function getResult() {
color: #ff3e00; // FIXME Configure DataURL and Port
text-transform: uppercase; let response = await fetch(`http://localhost:3333/api/v1/${query}`);
font-size: 4em; let text = await response.text();
font-weight: 100; let data = text;
return data;
} }
@media (min-width: 640px) { function submitHandler() {
main { result = getResult();
max-width: none; query = "";
}
} }
</style>
\ No newline at end of file submitHandler();
</script>
<div class="container mt-5">
<div class="row">
<div class="col-md"></div>
<div class="col-md-8 text-center">
<h1 class="display-4">Track Service</h1>
{#if result===undefined}
<p></p>
{:else}
{#await result}
<div class="spinner-border mt-5" role="status">
<span class="sr-only">Loading...</span>
</div>
{:then value}
<TrackService data={value} />
{:catch error}
<TrackService data={error.message}/>
{/await}
{/if}
</div>
<div class="col-md"></div>
</div>
</div>
\ No newline at end of file
contrib/aura-player/src/TrackService.svelte 0 → 100644
+ 10
− 0
View file @ 0a506deb
<script>
import { fly } from 'svelte/transition';
export let data;
</script>
<div class="card mt-5" transition:fly="{{ y: 150, duration: 300 }}">
<div class="card-body">
<h5 class="card-title">{data}</h5>
</div>
</div>
\ No newline at end of file
contrib/aura-player/src/main.js
+ 1
− 4
View file @ 0a506deb
import App from './App.svelte'; import App from './App.svelte';
const app = new App({ const app = new App({
target: document.body, target: document.body
props: {
name: 'world'
}
}); });
export default app; export default app;
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment