This is a basic example.
26 | 27 | 28 | 29 | 32 | 33 | 35 | 36 | 37 | -------------------------------------------------------------------------------- /examples/main.js: -------------------------------------------------------------------------------- 1 | require('aframe'); 2 | require('../src/index.js'); 3 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 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 src/index.js dist/aframe-speech-controls-component.js && webpack -p src/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 | "dependencies": { 54 | "annyang": "^2.6.0" 55 | } 56 | } 57 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | /* global AFRAME */ 2 | 3 | if (typeof AFRAME === 'undefined') { 4 | throw new Error('Component attempted to register before AFRAME was available.'); 5 | } 6 | 7 | var annyang = require('annyang'); 8 | 9 | var targetMoveLeft = function(){ 10 | console.log('moved target left'); 11 | var entity = document.getElementById('target'); 12 | pos = entity.getComputedAttribute('position'); 13 | entity.setAttribute('position', {x: pos.x-1, y: pos.y, z: pos.z}); 14 | } 15 | var targetMoveRight = function(){ 16 | console.log('moved target right'); 17 | var entity = document.getElementById('target'); 18 | pos = entity.getComputedAttribute('position'); 19 | entity.setAttribute('position', {x: pos.x+1, y: pos.y, z: pos.z}); 20 | } 21 | var targetMoveUp = function (){ 22 | console.log('moved target up'); 23 | var entity = document.getElementById('target'); 24 | pos = entity.getComputedAttribute('position'); 25 | entity.setAttribute('position', {x: pos.x, y: pos.y+1, z: pos.z}); 26 | } 27 | var targetMoveDown = function (){ 28 | console.log('moved target down'); 29 | var entity = document.getElementById('target'); 30 | pos = entity.getComputedAttribute('position'); 31 | entity.setAttribute('position', {x: pos.x, y: pos.y-1, z: pos.z}); 32 | } 33 | var targetMoveForward = function (){ 34 | console.log('moved target forward'); 35 | var entity = document.getElementById('target'); 36 | pos = entity.getComputedAttribute('position'); 37 | entity.setAttribute('position', {x: pos.x, y: pos.y, z: pos.z-1}); 38 | } 39 | var targetMoveBackward = function (){ 40 | console.log('moved target backward'); 41 | var entity = document.getElementById('target'); 42 | pos = entity.getComputedAttribute('position'); 43 | entity.setAttribute('position', {x: pos.x, y: pos.y, z: pos.z+1}); 44 | } 45 | 46 | /** 47 | * Speech Controls component for A-Frame. 48 | */ 49 | AFRAME.registerComponent('speech-controls', { 50 | schema: { 51 | positionStep: {default: 1}, 52 | }, 53 | 54 | /** 55 | * Set if component needs multiple instancing. 56 | */ 57 | multiple: false, 58 | 59 | /** 60 | * Called once when component is attached. Generally for initial setup. 61 | */ 62 | init: function () { 63 | console.log('init...'); 64 | if (annyang) { 65 | 66 | var commands = { 67 | 'left': targetMoveLeft, //fails 68 | 'right': targetMoveRight, 69 | 'forward': targetMoveForward, //OK 70 | 'backward': targetMoveBackward, 71 | 'downward': targetMoveDown, 72 | 'upward': targetMoveUp 73 | }; 74 | 75 | // Add our commands to annyang 76 | annyang.addCommands(commands); 77 | 78 | // Start listening. 79 | annyang.start(); 80 | console.log('annyang ok'); 81 | } 82 | }, 83 | 84 | /** 85 | * Called when component is attached and when component data changes. 86 | * Generally modifies the entity based on the data. 87 | */ 88 | update: function (oldData) { 89 | 90 | }, 91 | 92 | /** 93 | * Called when a component is removed (e.g., via removeAttribute). 94 | * Generally undoes all modifications to the entity. 95 | */ 96 | remove: function () { 97 | 98 | }, 99 | 100 | /** 101 | * Called when entity pauses. 102 | * Use to stop or remove any dynamic or background behavior such as events. 103 | */ 104 | pause: function () { 105 | 106 | }, 107 | 108 | /** 109 | * Called when entity resumes. 110 | * Use to continue or add any dynamic or background behavior such as events. 111 | */ 112 | play: function () { 113 | 114 | }, 115 | 116 | }); 117 | --------------------------------------------------------------------------------