Skip to content

Commit 5341523

Browse files
author
Marko Kungla
committed
Initial component boilerplate
1 parent 8aeed7b commit 5341523

File tree

8 files changed

+265
-18
lines changed

8 files changed

+265
-18
lines changed

‎README.md

Lines changed: 57 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,57 @@
1-
# aframe-invr-inputs
1+
## aframe-speech-controls-component
2+
3+
A Speech Controls component for [A-Frame](https://aframe.io).
4+
5+
### API
6+
7+
| Property | Description | Default Value |
8+
| -------- | ----------- | ------------- |
9+
| positionStep | Set a step which object changes the position | 1 |
10+
11+
### Installation
12+
13+
#### Browser
14+
15+
Install and use by directly including the [browser files](dist):
16+
17+
```html
18+
<head>
19+
<title>My A-Frame Scene</title>
20+
<script src="https://aframe.io/releases/0.3.2/aframe.min.js"></script>
21+
<script src="https://rawgit.com/Utopiah/aframe-speech-controls-component/master/dist/aframe-speech-controls-component.min.js"></script>
22+
</head>
23+
24+
<body>
25+
<a-scene>
26+
<a-entity speech-controls="positionStep: 1;"></a-entity>
27+
</a-scene>
28+
</body>
29+
```
30+
31+
#### npm
32+
33+
Install via npm:
34+
35+
```bash
36+
npm install aframe-speech-controls-component
37+
```
38+
39+
Then register and use.
40+
41+
```js
42+
require('aframe');
43+
require('aframe-speech-controls-component');
44+
```
45+
46+
### Contibuting
47+
48+
- Fork the repository
49+
- Clone the project
50+
- Install dev dependencies
51+
```sh
52+
npm install
53+
```
54+
- Start development environment which fires up browser and listens changes on files you edit.
55+
```sh
56+
npm start
57+
```

‎dist/.gitkeep

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
`npm run dist` to generate browser files.

‎dist/aframe-invr-inputs-component.js

Lines changed: 0 additions & 17 deletions
This file was deleted.

‎examples/basic-position-controls/index.html

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
<html>
2+
<head>
3+
<title>A-Frame Speech Controls Component - Basic</title>
4+
<script src="../build.js"></script>
5+
</head>
6+
<body>
7+
<a-scene>
8+
9+
<a-sphere speetch-controls="positionStep: .5" position="0 1.25 -1" radius="1.25" color="#EF2D5E"></a-sphere>
10+
<a-box position="-1 0.5 1" rotation="0 45 0" width="1" height="1" depth="1" color="#4CC3D9"></a-box>
11+
<a-cylinder position="1 0.75 1" radius="0.5" height="1.5" color="#FFC65D"></a-cylinder>
12+
<a-plane rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane>
13+
14+
<a-sky color="#ECECEC"></a-sky>
15+
<a-entity position="0 0 3.8">
16+
<a-camera></a-camera>
17+
</a-entity>
18+
</a-scene>
19+
20+
<!-- GitHub Corner. -->
21+
<a href="https://github.com/Utopiah/aframe-speech-controls-component" class="github-corner">
22+
<svg width="80" height="80" viewBox="0 0 250 250"
23+
style="fill:#222; color:#fff; position: absolute; top: 0; border: 0; right: 0;">
24+
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
25+
<path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2"
26+
fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path>
27+
<path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z"
28+
fill="currentColor" class="octo-body"></path>
29+
</svg>
30+
</a>
31+
<style>.github-corner:hover .octo-arm {
32+
animation: octocat-wave 560ms ease-in-out
33+
}
34+
35+
@keyframes octocat-wave {
36+
0%, 100% {
37+
transform: rotate(0)
38+
}
39+
20%, 60% {
40+
transform: rotate(-25deg)
41+
}
42+
40%, 80% {
43+
transform: rotate(10deg)
44+
}
45+
}
46+
47+
@media (max-width: 500px) {
48+
.github-corner:hover .octo-arm {
49+
animation: none
50+
}
51+
52+
.github-corner .octo-arm {
53+
animation: octocat-wave 560ms ease-in-out
54+
}
55+
}
56+
</style>
57+
</body>
58+
</html>

‎examples/index.html

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
<html>
2+
<head>
3+
<title>A-Frame Speech Controls Component</title>
4+
<style>
5+
html {
6+
background: #33425B;
7+
color: #FAFAFA;
8+
font-family: monospace;
9+
font-size: 20px;
10+
padding: 10px 20px;
11+
}
12+
h1 {
13+
font-weight: 300;
14+
}
15+
a {
16+
color: #FAFAFA;
17+
display: block;
18+
padding: 15px 0;
19+
}
20+
</style>
21+
</head>
22+
<body>
23+
<h1>A-Frame Speech Controls Component</h1>
24+
<a href="basic-position-controls/">Basic Position Controls</a>
25+
<p>This is a basic example.</p>
26+
27+
<!-- GitHub Corner. -->
28+
<a href="https://github.com/Utopiah/aframe-speech-controls-component" class="github-corner">
29+
<svg width="80" height="80" viewBox="0 0 250 250" style="fill:#222; color:#fff; position: absolute; top: 0; border: 0; right: 0;">
30+
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path>
31+
</svg>
32+
</a>
33+
<style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}
34+
</style>
35+
</body>
36+
</html>

‎examples/main.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
require('aframe');
2+
require('../src/index.js');

‎package.json

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
{
2+
"name": "aframe-speech-controls-component",
3+
"version": "1.0.0",
4+
"description": "Speech Controls component for A-Frame.",
5+
"main": "src/index.js",
6+
"scripts": {
7+
"build": "browserify examples/main.js -o examples/build.js",
8+
"dev": "budo examples/main.js:build.js --dir examples --port 8000 --live --open",
9+
"dist": "webpack index.js dist/aframe-speech-controls-component.js && webpack -p index.js dist/aframe-speech-controls-component.min.js",
10+
"lint": "semistandard -v | snazzy",
11+
"prepublish": "npm run dist",
12+
"preghpages": "npm run build && shx rm -rf gh-pages && shx mkdir gh-pages && shx cp -r examples/* gh-pages",
13+
"ghpages": "npm run preghpages && ghpages -p gh-pages",
14+
"start": "npm run dev"
15+
},
16+
"repository": {
17+
"type": "git",
18+
"url": "git+https://github.com/Utopiah/aframe-speech-controls-component.git"
19+
},
20+
"keywords": [
21+
"aframe",
22+
"aframe-component",
23+
"aframe-vr",
24+
"vr",
25+
"mozvr",
26+
"webvr"
27+
],
28+
"license": "MIT",
29+
"bugs": {
30+
"url": "https://github.com/Utopiah/aframe-speech-controls-component/issues"
31+
},
32+
"homepage": "https://github.com/Utopiah/aframe-speech-controls-component#readme",
33+
"devDependencies": {
34+
"aframe": "^0.3.2",
35+
"browserify": "^13.1.1",
36+
"browserify-css": "^0.9.2",
37+
"budo": "^9.2.1",
38+
"ghpages": "0.0.8",
39+
"inquirer": "^1.2.2",
40+
"randomcolor": "^0.4.4",
41+
"semistandard": "^9.1.0",
42+
"shelljs": "^0.7.5",
43+
"shx": "^0.1.4",
44+
"snazzy": "^5.0.0",
45+
"webpack": "^1.13.3"
46+
},
47+
"semistandard": {
48+
"ignore": [
49+
"examples/build.js",
50+
"dist/**"
51+
]
52+
}
53+
}

‎src/index.js

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
/* global AFRAME */
2+
3+
if (typeof AFRAME === 'undefined') {
4+
throw new Error('Component attempted to register before AFRAME was available.');
5+
}
6+
7+
/**
8+
* Speech Controls component for A-Frame.
9+
*/
10+
AFRAME.registerComponent('speech-controls', {
11+
schema: {
12+
positionStep: {default: 0},
13+
},
14+
15+
/**
16+
* Set if component needs multiple instancing.
17+
*/
18+
multiple: false,
19+
20+
/**
21+
* Called once when component is attached. Generally for initial setup.
22+
*/
23+
init: function () {
24+
25+
},
26+
27+
/**
28+
* Called when component is attached and when component data changes.
29+
* Generally modifies the entity based on the data.
30+
*/
31+
update: function (oldData) {
32+
33+
},
34+
35+
/**
36+
* Called when a component is removed (e.g., via removeAttribute).
37+
* Generally undoes all modifications to the entity.
38+
*/
39+
remove: function () {
40+
41+
},
42+
43+
/**
44+
* Called when entity pauses.
45+
* Use to stop or remove any dynamic or background behavior such as events.
46+
*/
47+
pause: function () {
48+
49+
},
50+
51+
/**
52+
* Called when entity resumes.
53+
* Use to continue or add any dynamic or background behavior such as events.
54+
*/
55+
play: function () {
56+
57+
}
58+
});

0 commit comments

Comments
 (0)