diff --git a/.circleci/config.yml b/.circleci/config.yml deleted file mode 100644 index 529c4d18..00000000 --- a/.circleci/config.yml +++ /dev/null @@ -1,40 +0,0 @@ -version: 2 -jobs: - build: - docker: - # specify the version you desire here - - image: circleci/node:12.18 - - # Specify service dependencies here if necessary - # CircleCI maintains a library of pre-built images - # documented at https://circleci.com/docs/2.0/circleci-images/ - # - image: circleci/mongo:3.4.4 - - working_directory: ~/MYR - - steps: - - checkout - - run: - name: Create firebase key file - command: mkdir ~/MYR/src/keys && touch ~/MYR/src/keys/firebase.js && echo -e "export const firebaseKey = \"$FIREBASE_KEY\";\nexport default firebaseKey;" > src/keys/firebase.js - # Download and cache dependencies - - restore_cache: - keys: - - v1-dependencies-{{ checksum "package.json" }} - # fallback to using the latest cache if no exact match is found - - v1-dependencies- - - - run: npm ci - - - save_cache: - paths: - - node_modules - key: v1-dependencies-{{ checksum "package.json" }} - - # run tests! - - run: - name: Run test suites - command: npm test - - run: - name: Run eslint - command: npm run lint diff --git a/.dockerignore b/.dockerignore new file mode 100644 index 00000000..b512c09d --- /dev/null +++ b/.dockerignore @@ -0,0 +1 @@ +node_modules \ No newline at end of file diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml new file mode 100644 index 00000000..531fd24e --- /dev/null +++ b/.github/workflows/ci.yml @@ -0,0 +1,25 @@ +name: Build MYR + +on: [push, pull_request] + +jobs: + ci-checks: + runs-on: ubuntu-latest + container: + image: node:10.13 + + steps: + - uses: actions/checkout@v1 + - name: Setup cache + uses: actions/cache@v2 + with: + path: node_modules + key: ${{ runner.os }}-${{ hashFiles('**/package-lock.json') }} + - name: Fetch packages + run: npm ci + - name: Run Linter + run: npm run lint + - name: Run unit tests + run: npm test + - name: Build production build + run: npm run build \ No newline at end of file diff --git a/.github/workflows/deploy_beta.yml b/.github/workflows/deploy_beta.yml new file mode 100644 index 00000000..09383f9e --- /dev/null +++ b/.github/workflows/deploy_beta.yml @@ -0,0 +1,28 @@ +name: Deploy staging image + +on: + push: + branches: + - dev + +jobs: + update_upstream: + runs-on: ubuntu-latest + container: + image: docker + steps: + - uses: actions/checkout@v1 + - name: Set the branch variable + uses: nelonoel/branch-name@v1.0.1 + - name: Log into Quay + run: docker login quay.io -u umlecg+myr_bot -p ${{ secrets.QUAY_BOT_PASSWORD }} + - name: Build the docker image + run: docker build -t quay.io/umlecg/myr-frontend:${BRANCH_NAME} --build-arg REACT_APP_GOOGLE_CLIENTID=${{ secrets.MYR_GOOGLE_OAUTH2 }} . + - name: Push the new image + run: docker push quay.io/umlecg/myr-frontend:${BRANCH_NAME} + - name: Notify the build repository + uses: peter-evans/repository-dispatch@v1 + with: + token: ${{ secrets.MYR_ACCESS_TOKEN }} + event-type: update_dev + repository: engaging-computing/MYR-build \ No newline at end of file diff --git a/.github/workflows/deploy_prod.yml b/.github/workflows/deploy_prod.yml new file mode 100644 index 00000000..00c2ce32 --- /dev/null +++ b/.github/workflows/deploy_prod.yml @@ -0,0 +1,28 @@ +name: Deploy production image + +on: + push: + branches: + - master + +jobs: + update_upstream: + runs-on: ubuntu-latest + container: + image: docker + steps: + - uses: actions/checkout@v1 + - name: Set the branch variable + uses: nelonoel/branch-name@v1.0.1 + - name: Log into Quay + run: docker login quay.io -u umlecg+myr_bot -p ${{ secrets.QUAY_BOT_PASSWORD }} + - name: Build the docker image + run: docker build -t quay.io/umlecg/myr-frontend:${BRANCH_NAME} --build-arg REACT_APP_GOOGLE_CLIENTID=${{ secrets.MYR_GOOGLE_OAUTH2 }} . + - name: Push the new image + run: docker push quay.io/umlecg/myr-frontend:${BRANCH_NAME} + - name: Notify the build repository + uses: peter-evans/repository-dispatch@v1 + with: + token: ${{ secrets.MYR_ACCESS_TOKEN }} + event-type: update_master + repository: engaging-computing/MYR-build \ No newline at end of file diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 00000000..d90e8872 --- /dev/null +++ b/Dockerfile @@ -0,0 +1,11 @@ +FROM node:10.13 + +WORKDIR /app +COPY . /app + +ARG REACT_APP_GOOGLE_CLIENTID="totally invalid.apps.googleusercontent.com" +ENV REACT_APP_GOOGLE_CLIENTID ${REACT_APP_GOOGLE_CLIENTID} + +RUN npm install +RUN npm run build +RUN npm run doc \ No newline at end of file diff --git a/README.md b/README.md index 6b413e43..ff37e0a9 100644 --- a/README.md +++ b/README.md @@ -9,10 +9,16 @@ The Engaging Computing Group develops new technologies to enable learners—yout ## Status [![CircleCI](https://circleci.com/gh/engaging-computing/MYR.svg?style=shield)](https://circleci.com/gh/engaging-computing/MYR) -## Change Log - 2.1.1 -> 2.2.0 -- Adds Lighting features to MYR -- Adds Texture features to MYR -- Updates copyright in the footer to be in the form `2018 - ` +## Change Log - 2.2.0 -> 2.3.0 +- Adds Minecraft style flying controls + - Removes flying setting toggle +- Updates default scene to show helper grid by default +- MYR provided textures are now case insensitive +- Textures can be tiled +- Fixes black flickering bug when entering VR mode on mobile +- Spelling fixes +- Updated AFrame to use v1.x.y + ## Acknowledgments diff --git a/package-lock.json b/package-lock.json index 09494b61..df7ed67e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "myr", - "version": "2.1.0", + "version": "2.2.0", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -1628,11 +1628,6 @@ "loader-utils": "^1.1.0" } }, - "@tweenjs/tween.js": { - "version": "16.11.0", - "resolved": "https://registry.npmjs.org/@tweenjs/tween.js/-/tween.js-16.11.0.tgz", - "integrity": "sha1-bnqKPWx4oFfs1WBQh5MEBtTgWAA=" - }, "@types/color-name": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/@types/color-name/-/color-name-1.1.1.tgz", @@ -1890,7 +1885,8 @@ "acorn": { "version": "5.7.4", "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.7.4.tgz", - "integrity": "sha512-1D++VG7BhrtvQpNbBzovKNc1FLGGEE/oGe7b9xJm/RFHMBeUaUGpluV9RLjZa47YFdPcDAenEYuq9pQPcMdLJg==" + "integrity": "sha512-1D++VG7BhrtvQpNbBzovKNc1FLGGEE/oGe7b9xJm/RFHMBeUaUGpluV9RLjZa47YFdPcDAenEYuq9pQPcMdLJg==", + "dev": true }, "acorn-dynamic-import": { "version": "3.0.0", @@ -1937,30 +1933,22 @@ "dev": true }, "aframe": { - "version": "0.8.2", - "resolved": "https://registry.npmjs.org/aframe/-/aframe-0.8.2.tgz", - "integrity": "sha512-kp0c3f17moiilChTsD95q+USB7/12LuusGERSmO2X7Cgq6q6evVv9Oe7qRMZ6Baf26gS0T9Z7umc/e1alqcEVA==", + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/aframe/-/aframe-1.0.4.tgz", + "integrity": "sha512-iG/4VyRt22zUPxDsFjP4SHUXNPGIStM2hHX/iPblht6dtN8m09e7LAaFq4iQdXoT0EkZBWEVmXVBF1J7Tca3QQ==", "requires": { - "@tweenjs/tween.js": "^16.8.0", - "browserify-css": "^0.8.2", - "debug": "github:ngokevin/debug#ef5f8e66d49ce8bc64c6f282c15f8b7164409e3a", + "custom-event-polyfill": "^1.0.6", + "debug": "github:ngokevin/debug#noTimestamp", "deep-assign": "^2.0.0", "document-register-element": "github:dmarcos/document-register-element#8ccc532b7f3744be954574caf3072a5fd260ca90", - "envify": "^3.4.1", "load-bmfont": "^1.2.3", "object-assign": "^4.0.1", "present": "0.0.6", "promise-polyfill": "^3.1.0", - "style-attr": "^1.0.2", - "three": "github:supermedium/three.js#5ef2887ab3621cae54fa129a500424d6caa25b62", - "three-bmfont-text": "^2.1.0", - "webvr-polyfill": "^0.10.5" - }, - "dependencies": { - "three": { - "version": "github:supermedium/three.js#5ef2887ab3621cae54fa129a500424d6caa25b62", - "from": "github:supermedium/three.js#r90fixMTLLoader" - } + "super-animejs": "^3.1.0", + "super-three": "^0.111.6", + "three-bmfont-text": "github:dmarcos/three-bmfont-text#1babdf8507c731a18f8af3b807292e2b9740955e", + "webvr-polyfill": "^0.10.10" } }, "aframe-animation-component": { @@ -1996,7 +1984,7 @@ "dependencies": { "cannon": { "version": "github:donmccurdy/cannon.js#022e8ba53fa83abf0ad8a0e4fd08623123838a17", - "from": "github:donmccurdy/cannon.js#v0.6.2-dev1" + "from": "github:donmccurdy/cannon.js#022e8ba53fa83abf0ad8a0e4fd08623123838a17" } } }, @@ -2055,11 +2043,6 @@ "integrity": "sha1-l6ERlkmyEa0zaR2fn0hqjsn74KM=", "dev": true }, - "amdefine": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz", - "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU=" - }, "an-array": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/an-array/-/an-array-1.0.0.tgz", @@ -2444,6 +2427,7 @@ "version": "2.0.0", "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz", "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=", + "dev": true, "requires": { "arr-flatten": "^1.0.1" } @@ -2451,7 +2435,8 @@ "arr-flatten": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.1.0.tgz", - "integrity": "sha512-L3hKV5R/p5o81R7O02IGnwpDmkp6E982XhtbuwSe3O4qOtMMMtodicASA1Cny2U+aCXcNpml+m4dPsvsJ3jatg==" + "integrity": "sha512-L3hKV5R/p5o81R7O02IGnwpDmkp6E982XhtbuwSe3O4qOtMMMtodicASA1Cny2U+aCXcNpml+m4dPsvsJ3jatg==", + "dev": true }, "arr-union": { "version": "3.1.0", @@ -2523,7 +2508,8 @@ "array-unique": { "version": "0.2.1", "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz", - "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM=" + "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM=", + "dev": true }, "array.prototype.find": { "version": "2.1.1", @@ -2645,11 +2631,6 @@ "integrity": "sha1-WWZ/QfrdTyDMvCu5a41Pf3jsA2c=", "dev": true }, - "ast-types": { - "version": "0.9.6", - "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.6.tgz", - "integrity": "sha1-ECyenpAF0+fjgpvwxPok7oYu6bk=" - }, "ast-types-flow": { "version": "0.0.7", "resolved": "https://registry.npmjs.org/ast-types-flow/-/ast-types-flow-0.0.7.tgz", @@ -3700,11 +3681,6 @@ } } }, - "base62": { - "version": "1.2.8", - "resolved": "https://registry.npmjs.org/base62/-/base62-1.2.8.tgz", - "integrity": "sha512-V6YHUbjLxN1ymqNLb1DPHoU1CpfdL7d2YTIp5W3U4hhoG4hhxNmsFDs66M9EXxBiSEke5Bt5dwdfMwwZF70iLA==" - }, "base64-arraybuffer": { "version": "0.1.5", "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz", @@ -3863,9 +3839,9 @@ "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24=" }, "bootstrap": { - "version": "4.5.0", - "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.5.0.tgz", - "integrity": "sha512-Z93QoXvodoVslA+PWNdk23Hze4RBYIkpb5h8I2HY2Tu2h7A0LpAgLcyrhrSUyo2/Oxm2l1fRZPs1e5hnxnliXA==" + "version": "4.6.0", + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.6.0.tgz", + "integrity": "sha512-Io55IuQY3kydzHtbGvQya3H+KorS/M9rSNyfCGCg9WZ4pyT/lCxIlpJgG1GXW/PswzC84Tr2fBYi+7+jFVQQBw==" }, "brace": { "version": "0.11.1", @@ -3885,6 +3861,7 @@ "version": "1.8.5", "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz", "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=", + "dev": true, "requires": { "expand-range": "^1.8.1", "preserve": "^0.2.0", @@ -3945,26 +3922,6 @@ "evp_bytestokey": "^1.0.0" } }, - "browserify-css": { - "version": "0.8.4", - "resolved": "https://registry.npmjs.org/browserify-css/-/browserify-css-0.8.4.tgz", - "integrity": "sha1-Hk4nedy7By0Jvq605vaVAdVE1/M=", - "requires": { - "clean-css": "2.2.x", - "concat-stream": "1.4.x", - "css": "1.6.x", - "find-node-modules": "^1.0.1", - "lodash": "3.6.x", - "through2": "0.6.x" - }, - "dependencies": { - "lodash": { - "version": "3.6.0", - "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.6.0.tgz", - "integrity": "sha1-Umao9J3Zib5Pn2gbbyoMVShdDZo=" - } - } - }, "browserify-des": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/browserify-des/-/browserify-des-1.0.2.tgz", @@ -4549,14 +4506,6 @@ "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.6.tgz", "integrity": "sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q==" }, - "clean-css": { - "version": "2.2.23", - "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-2.2.23.tgz", - "integrity": "sha1-BZC1R4tRbEkD7cLYm9P9vdKGMow=", - "requires": { - "commander": "2.2.x" - } - }, "cli-cursor": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-3.1.0.tgz", @@ -4776,11 +4725,6 @@ "delayed-stream": "~1.0.0" } }, - "commander": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/commander/-/commander-2.2.0.tgz", - "integrity": "sha1-F1rUuTF/P/YV8gHB5XIk9Vo+kd8=" - }, "common-tags": { "version": "1.8.0", "resolved": "https://registry.npmjs.org/common-tags/-/common-tags-1.8.0.tgz", @@ -4793,37 +4737,6 @@ "integrity": "sha1-3dgA2gxmEnOTzKWVDqloo6rxJTs=", "dev": true }, - "commoner": { - "version": "0.10.8", - "resolved": "https://registry.npmjs.org/commoner/-/commoner-0.10.8.tgz", - "integrity": "sha1-NPw2cs0kOT6LtH5wyqApOBH08sU=", - "requires": { - "commander": "^2.5.0", - "detective": "^4.3.1", - "glob": "^5.0.15", - "graceful-fs": "^4.1.2", - "iconv-lite": "^0.4.5", - "mkdirp": "^0.5.0", - "private": "^0.1.6", - "q": "^1.1.2", - "recast": "^0.11.17" - }, - "dependencies": { - "commander": { - "version": "2.20.3", - "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz", - "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==" - }, - "iconv-lite": { - "version": "0.4.24", - "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz", - "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==", - "requires": { - "safer-buffer": ">= 2.1.2 < 3" - } - } - } - }, "component-bind": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz", @@ -4885,16 +4798,6 @@ "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=" }, - "concat-stream": { - "version": "1.4.11", - "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.4.11.tgz", - "integrity": "sha512-X3JMh8+4je3U1cQpG87+f9lXHDrqcb2MVLg9L7o8b1UZ0DzhRrUpdn65ttzu10PpJPPI3MQNkis+oha6TSA9Mw==", - "requires": { - "inherits": "~2.0.1", - "readable-stream": "~1.1.9", - "typedarray": "~0.0.5" - } - }, "confusing-browser-globals": { "version": "1.0.9", "resolved": "https://registry.npmjs.org/confusing-browser-globals/-/confusing-browser-globals-1.0.9.tgz", @@ -5124,15 +5027,6 @@ "randomfill": "^1.0.3" } }, - "css": { - "version": "1.6.0", - "resolved": "https://registry.npmjs.org/css/-/css-1.6.0.tgz", - "integrity": "sha1-wG//CvuzE/zlvOBw12UxpsjTAKo=", - "requires": { - "css-parse": "1.7.0", - "css-stringify": "1.4.1" - } - }, "css-color-keywords": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/css-color-keywords/-/css-color-keywords-1.0.0.tgz", @@ -5254,11 +5148,6 @@ "source-list-map": "^2.0.0" } }, - "css-parse": { - "version": "1.7.0", - "resolved": "https://registry.npmjs.org/css-parse/-/css-parse-1.7.0.tgz", - "integrity": "sha1-Mh9s9zeCpv91ERE5D8BeLGV9jJs=" - }, "css-select": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz", @@ -5287,14 +5176,6 @@ "regexpu-core": "^4.6.0" } }, - "css-stringify": { - "version": "1.4.1", - "resolved": "https://registry.npmjs.org/css-stringify/-/css-stringify-1.4.1.tgz", - "integrity": "sha1-JSzL8D9yOgCb3Ydw/n6ydBca/fo=", - "requires": { - "source-map": "~0.1.31" - } - }, "css-to-react-native": { "version": "2.3.2", "resolved": "https://registry.npmjs.org/css-to-react-native/-/css-to-react-native-2.3.2.tgz", @@ -5774,6 +5655,11 @@ "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.11.tgz", "integrity": "sha512-l8YyEC9NBkSm783PFTvh0FmJy7s5pFKrDp49ZL7zBGX3fWkO+N4EEyan1qqp8cwPLDcD0OSdyY6hAMoxp34JFw==" }, + "custom-event-polyfill": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/custom-event-polyfill/-/custom-event-polyfill-1.0.7.tgz", + "integrity": "sha512-TDDkd5DkaZxZFM8p+1I3yAlvM3rSr1wbrOliG4yJiwinMZN8z/iGL7BTlDkrJcYTmgUSb4ywVCc3ZaUtOtC76w==" + }, "cyclist": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-1.0.1.tgz", @@ -5999,11 +5885,6 @@ } } }, - "defined": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/defined/-/defined-1.0.0.tgz", - "integrity": "sha1-yY2bzvdWdBiOEQlpFRGZ45sfppM=" - }, "del": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/del/-/del-3.0.0.tgz", @@ -6089,14 +5970,6 @@ "integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA=", "dev": true }, - "detect-file": { - "version": "0.1.0", - "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz", - "integrity": "sha1-STXe39lIhkjgBrASlWbpOGcR6mM=", - "requires": { - "fs-exists-sync": "^0.1.0" - } - }, "detect-indent": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/detect-indent/-/detect-indent-4.0.0.tgz", @@ -6144,15 +6017,6 @@ } } }, - "detective": { - "version": "4.7.1", - "resolved": "https://registry.npmjs.org/detective/-/detective-4.7.1.tgz", - "integrity": "sha512-H6PmeeUcZloWtdt4DAkFyzFL94arpHr3NOwwmVILFiy+9Qd4JTxxXrzfyGk/lmct2qVGBwTSwSXagqu2BxmWig==", - "requires": { - "acorn": "^5.2.1", - "defined": "^1.0.0" - } - }, "diff": { "version": "3.5.0", "resolved": "https://registry.npmjs.org/diff/-/diff-3.5.0.tgz", @@ -6255,7 +6119,7 @@ }, "document-register-element": { "version": "github:dmarcos/document-register-element#8ccc532b7f3744be954574caf3072a5fd260ca90", - "from": "github:dmarcos/document-register-element#8ccc532b7" + "from": "github:dmarcos/document-register-element#8ccc532b7f3744be954574caf3072a5fd260ca90" }, "dom-converter": { "version": "0.2.0", @@ -6611,15 +6475,6 @@ "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.2.tgz", "integrity": "sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w==" }, - "envify": { - "version": "3.4.1", - "resolved": "https://registry.npmjs.org/envify/-/envify-3.4.1.tgz", - "integrity": "sha1-1xIjKejfFoi6dxsSUBkXyc5cvOg=", - "requires": { - "jstransform": "^11.0.3", - "through": "~2.3.4" - } - }, "envinfo": { "version": "7.5.0", "resolved": "https://registry.npmjs.org/envinfo/-/envinfo-7.5.0.tgz", @@ -7722,11 +7577,6 @@ } } }, - "esprima-fb": { - "version": "15001.1.0-dev-harmony-fb", - "resolved": "https://registry.npmjs.org/esprima-fb/-/esprima-fb-15001.1.0-dev-harmony-fb.tgz", - "integrity": "sha1-MKlHMDxrjV6VW+4rmbHSMyBqaQE=" - }, "esquery": { "version": "1.3.1", "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.3.1.tgz", @@ -7873,6 +7723,7 @@ "version": "0.1.5", "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz", "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=", + "dev": true, "requires": { "is-posix-bracket": "^0.1.0" } @@ -7881,18 +7732,11 @@ "version": "1.8.2", "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz", "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc=", + "dev": true, "requires": { "fill-range": "^2.1.0" } }, - "expand-tilde": { - "version": "1.2.2", - "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz", - "integrity": "sha1-C4HrqJflo9MdHD0QL48BRB5VlEk=", - "requires": { - "os-homedir": "^1.0.1" - } - }, "expect": { "version": "23.6.0", "resolved": "https://registry.npmjs.org/expect/-/expect-23.6.0.tgz", @@ -8065,6 +7909,7 @@ "version": "0.3.2", "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz", "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=", + "dev": true, "requires": { "is-extglob": "^1.0.0" } @@ -8485,7 +8330,8 @@ "filename-regex": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz", - "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY=" + "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY=", + "dev": true }, "fileset": { "version": "2.0.3", @@ -8523,6 +8369,7 @@ "version": "2.2.4", "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.4.tgz", "integrity": "sha512-cnrcCbj01+j2gTG921VZPnHbjmdAf8oQV/iGeV2kZxGSyfYjjTyY79ErsK1WJWMpw6DaApEX72binqJE+/d+5Q==", + "dev": true, "requires": { "is-number": "^2.1.0", "isobject": "^2.0.0", @@ -8534,12 +8381,14 @@ "isarray": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz", - "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=" + "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=", + "dev": true }, "isobject": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz", "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=", + "dev": true, "requires": { "isarray": "1.0.0" } @@ -8589,15 +8438,6 @@ "pkg-dir": "^2.0.0" } }, - "find-node-modules": { - "version": "1.0.4", - "resolved": "https://registry.npmjs.org/find-node-modules/-/find-node-modules-1.0.4.tgz", - "integrity": "sha1-tt6zzMtpnIcDdne87eLF9YYrJVA=", - "requires": { - "findup-sync": "0.4.2", - "merge": "^1.2.0" - } - }, "find-root": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz", @@ -8611,17 +8451,6 @@ "locate-path": "^3.0.0" } }, - "findup-sync": { - "version": "0.4.2", - "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.2.tgz", - "integrity": "sha1-qBF9D3MST1pFRoOVef5S1xKfteU=", - "requires": { - "detect-file": "^0.1.0", - "is-glob": "^2.0.1", - "micromatch": "^2.3.7", - "resolve-dir": "^0.1.0" - } - }, "flat-cache": { "version": "1.3.4", "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-1.3.4.tgz", @@ -8731,12 +8560,14 @@ "for-in": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz", - "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA=" + "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA=", + "dev": true }, "for-own": { "version": "0.1.5", "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz", "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4=", + "dev": true, "requires": { "for-in": "^1.0.1" } @@ -9178,11 +9009,6 @@ } } }, - "fs-exists-sync": { - "version": "0.1.0", - "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz", - "integrity": "sha1-mC1ok6+RjnLQjeyehnP/K1qNat0=" - }, "fs-extra": { "version": "8.1.0", "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-8.1.0.tgz", @@ -9853,22 +9679,11 @@ "resolved": "https://registry.npmjs.org/gl-preserve-state/-/gl-preserve-state-1.0.0.tgz", "integrity": "sha512-zQZ25l3haD4hvgJZ6C9+s0ebdkW9y+7U2qxvGu1uWOJh8a4RU+jURIKEQhf8elIlFpMH6CrAY2tH0mYrRjet3Q==" }, - "glob": { - "version": "5.0.15", - "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz", - "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E=", - "requires": { - "inflight": "^1.0.4", - "inherits": "2", - "minimatch": "2 || 3", - "once": "^1.3.0", - "path-is-absolute": "^1.0.0" - } - }, "glob-base": { "version": "0.3.0", "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz", "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q=", + "dev": true, "requires": { "glob-parent": "^2.0.0", "is-glob": "^2.0.0" @@ -9878,6 +9693,7 @@ "version": "2.0.0", "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz", "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg=", + "dev": true, "requires": { "is-glob": "^2.0.0" } @@ -9897,26 +9713,6 @@ "process": "~0.5.1" } }, - "global-modules": { - "version": "0.2.3", - "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz", - "integrity": "sha1-6lo77ULG1s6ZWk+KEmm12uIjgo0=", - "requires": { - "global-prefix": "^0.1.4", - "is-windows": "^0.2.0" - } - }, - "global-prefix": { - "version": "0.1.5", - "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz", - "integrity": "sha1-jTvGuNo8qBEqFg2NSW/wRiv+948=", - "requires": { - "homedir-polyfill": "^1.0.0", - "ini": "^1.3.4", - "is-windows": "^0.2.0", - "which": "^1.2.12" - } - }, "globals": { "version": "11.12.0", "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz", @@ -10331,6 +10127,7 @@ "version": "1.0.3", "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.3.tgz", "integrity": "sha512-eSmmWE5bZTK2Nou4g0AI3zZ9rswp7GRKoKXS1BLUkvPviOqs4YTN1djQIqrXy9k5gEtdLPy86JjRwsNM9tnDcA==", + "dev": true, "requires": { "parse-passwd": "^1.0.0" } @@ -10957,7 +10754,8 @@ "version": "2.7.0", "resolved": "https://registry.npmjs.org/acorn/-/acorn-2.7.0.tgz", "integrity": "sha1-q259nYhqrKiwhbwzEreaGYQz8Oc=", - "dev": true + "dev": true, + "optional": true }, "acorn-globals": { "version": "1.0.9", @@ -10993,7 +10791,8 @@ "version": "0.3.8", "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.3.8.tgz", "integrity": "sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg==", - "dev": true + "dev": true, + "optional": true }, "cssstyle": { "version": "0.2.37", @@ -11232,7 +11031,8 @@ "ini": { "version": "1.3.5", "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz", - "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==" + "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==", + "dev": true }, "inquirer": { "version": "7.0.4", @@ -11476,12 +11276,14 @@ "is-dotfile": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.3.tgz", - "integrity": "sha1-pqLzL/0t+wT1yiXs0Pa4PPeYoeE=" + "integrity": "sha1-pqLzL/0t+wT1yiXs0Pa4PPeYoeE=", + "dev": true }, "is-equal-shallow": { "version": "0.1.3", "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz", "integrity": "sha1-IjgJj8Ih3gvPpdnqxMRdY4qhxTQ=", + "dev": true, "requires": { "is-primitive": "^2.0.0" } @@ -11489,12 +11291,14 @@ "is-extendable": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz", - "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=" + "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=", + "dev": true }, "is-extglob": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz", - "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA=" + "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA=", + "dev": true }, "is-finite": { "version": "1.1.0", @@ -11522,6 +11326,7 @@ "version": "2.0.1", "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz", "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=", + "dev": true, "requires": { "is-extglob": "^1.0.0" } @@ -11535,6 +11340,7 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz", "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8=", + "dev": true, "requires": { "kind-of": "^3.0.2" } @@ -11586,7 +11392,8 @@ "is-posix-bracket": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz", - "integrity": "sha1-MzTceXdDaOkvAW5vvAqI9c1ua8Q=" + "integrity": "sha1-MzTceXdDaOkvAW5vvAqI9c1ua8Q=", + "dev": true }, "is-potential-custom-element-name": { "version": "1.0.0", @@ -11597,7 +11404,8 @@ "is-primitive": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz", - "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU=" + "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU=", + "dev": true }, "is-regex": { "version": "1.1.0", @@ -11678,11 +11486,6 @@ "resolved": "https://registry.npmjs.org/is-what/-/is-what-3.10.0.tgz", "integrity": "sha512-U4RYCXNOmATQHlOPlOCHCfXyKEFIPqvyaKDqYRuLbD6EYKcTTfc3YXkAYjzOVxO3zt34L+Wh2feIyWrYiZ7kng==" }, - "is-windows": { - "version": "0.2.0", - "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-0.2.0.tgz", - "integrity": "sha1-3hqm1j6indJIc3tp8f+LgALSEIw=" - }, "is-wsl": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-1.1.0.tgz", @@ -13901,33 +13704,6 @@ "jss": "10.5.0" } }, - "jstransform": { - "version": "11.0.3", - "resolved": "https://registry.npmjs.org/jstransform/-/jstransform-11.0.3.tgz", - "integrity": "sha1-CaeJk+CuTU70SH9hVakfYZDLQiM=", - "requires": { - "base62": "^1.1.0", - "commoner": "^0.10.1", - "esprima-fb": "^15001.1.0-dev-harmony-fb", - "object-assign": "^2.0.0", - "source-map": "^0.4.2" - }, - "dependencies": { - "object-assign": { - "version": "2.1.1", - "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-2.1.1.tgz", - "integrity": "sha1-Q8NuXVaf+OSBbE76i+AtJpZ8GKo=" - }, - "source-map": { - "version": "0.4.4", - "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz", - "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s=", - "requires": { - "amdefine": ">=0.0.4" - } - } - } - }, "jsx-ast-utils": { "version": "2.4.1", "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-2.4.1.tgz", @@ -13948,6 +13724,7 @@ "version": "3.2.2", "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz", "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=", + "dev": true, "requires": { "is-buffer": "^1.1.5" } @@ -14452,7 +14229,8 @@ "math-random": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/math-random/-/math-random-1.0.4.tgz", - "integrity": "sha512-rUxjysqif/BZQH2yhd5Aaq7vXMSx9NdEsQcyA07uEzIvxgI7zIr33gGsh+RU0/XjmQpCW7RsVof1vlkvQVCK5A==" + "integrity": "sha512-rUxjysqif/BZQH2yhd5Aaq7vXMSx9NdEsQcyA07uEzIvxgI7zIr33gGsh+RU0/XjmQpCW7RsVof1vlkvQVCK5A==", + "dev": true }, "md5.js": { "version": "1.3.5", @@ -14538,7 +14316,8 @@ "merge": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/merge/-/merge-1.2.1.tgz", - "integrity": "sha512-VjFo4P5Whtj4vsLzsYBu5ayHhoHJ0UqNm7ibvShmbmoz7tGi0vXaoJbGdB+GmDMLUdg8DpQXEIeVDAe8MaABvQ==" + "integrity": "sha512-VjFo4P5Whtj4vsLzsYBu5ayHhoHJ0UqNm7ibvShmbmoz7tGi0vXaoJbGdB+GmDMLUdg8DpQXEIeVDAe8MaABvQ==", + "dev": true }, "merge-anything": { "version": "2.4.4", @@ -14622,6 +14401,7 @@ "version": "2.3.11", "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz", "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=", + "dev": true, "requires": { "arr-diff": "^2.0.0", "array-unique": "^0.2.1", @@ -15194,6 +14974,7 @@ "version": "2.1.1", "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz", "integrity": "sha1-GrKLVW4Zg2Oowab35vogE3/mrtk=", + "dev": true, "requires": { "remove-trailing-separator": "^1.0.1" } @@ -15389,6 +15170,7 @@ "version": "2.0.1", "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz", "integrity": "sha1-Gpx0SCnznbuFjHbKNXmuKlTr0fo=", + "dev": true, "requires": { "for-own": "^0.1.4", "is-extendable": "^0.1.1" @@ -15501,7 +15283,8 @@ "os-homedir": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz", - "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=" + "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=", + "dev": true }, "os-locale": { "version": "3.1.0", @@ -15674,6 +15457,7 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz", "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw=", + "dev": true, "requires": { "glob-base": "^0.3.0", "is-dotfile": "^1.0.0", @@ -15700,7 +15484,8 @@ "parse-passwd": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz", - "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY=" + "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY=", + "dev": true }, "parse5": { "version": "3.0.3", @@ -15816,7 +15601,8 @@ "version": "2.2.2", "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.2.2.tgz", "integrity": "sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg==", - "dev": true + "dev": true, + "optional": true }, "pify": { "version": "2.3.0", @@ -21560,7 +21346,8 @@ "preserve": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz", - "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks=" + "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks=", + "dev": true }, "prettier": { "version": "1.19.1", @@ -21629,7 +21416,8 @@ "private": { "version": "0.1.8", "resolved": "https://registry.npmjs.org/private/-/private-0.1.8.tgz", - "integrity": "sha512-VvivMrbvd2nKkiG38qjULzlc+4Vx4wm/whI9pQD35YrARNnhxeiRktSOhSukRLFNlzg6Br/cJPet5J/u19r/mg==" + "integrity": "sha512-VvivMrbvd2nKkiG38qjULzlc+4Vx4wm/whI9pQD35YrARNnhxeiRktSOhSukRLFNlzg6Br/cJPet5J/u19r/mg==", + "dev": true }, "process": { "version": "0.5.2", @@ -21779,7 +21567,8 @@ "q": { "version": "1.5.1", "resolved": "https://registry.npmjs.org/q/-/q-1.5.1.tgz", - "integrity": "sha1-fjL3W0E4EpHQRhHxvxQQmsAGUdc=" + "integrity": "sha1-fjL3W0E4EpHQRhHxvxQQmsAGUdc=", + "dev": true }, "qr.js": { "version": "0.0.0", @@ -21894,6 +21683,7 @@ "version": "3.1.1", "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-3.1.1.tgz", "integrity": "sha512-TuDE5KxZ0J461RVjrJZCJc+J+zCkTb1MbH9AQUq68sMhOMcy9jLcb3BrZKgp9q9Ncltdg4QVqWrH02W2EFFVYw==", + "dev": true, "requires": { "is-number": "^4.0.0", "kind-of": "^6.0.0", @@ -21903,12 +21693,14 @@ "is-number": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/is-number/-/is-number-4.0.0.tgz", - "integrity": "sha512-rSklcAIlf1OmFdyAqbnWTLVelsQ58uvZ66S/ZyawjWqIviTWCjg2PzVGw8WUA+nNuPTqb4wgA+NszrJ+08LlgQ==" + "integrity": "sha512-rSklcAIlf1OmFdyAqbnWTLVelsQ58uvZ66S/ZyawjWqIviTWCjg2PzVGw8WUA+nNuPTqb4wgA+NszrJ+08LlgQ==", + "dev": true }, "kind-of": { "version": "6.0.3", "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz", - "integrity": "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==" + "integrity": "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==", + "dev": true } } }, @@ -23200,29 +22992,6 @@ "util.promisify": "^1.0.0" } }, - "recast": { - "version": "0.11.23", - "resolved": "https://registry.npmjs.org/recast/-/recast-0.11.23.tgz", - "integrity": "sha1-RR/TAEqx5N+bTktmN2sqIZEkYtM=", - "requires": { - "ast-types": "0.9.6", - "esprima": "~3.1.0", - "private": "~0.1.5", - "source-map": "~0.5.0" - }, - "dependencies": { - "esprima": { - "version": "3.1.3", - "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz", - "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM=" - }, - "source-map": { - "version": "0.5.7", - "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", - "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=" - } - } - }, "recursive-readdir": { "version": "2.2.2", "resolved": "https://registry.npmjs.org/recursive-readdir/-/recursive-readdir-2.2.2.tgz", @@ -23349,6 +23118,7 @@ "version": "0.4.4", "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.4.tgz", "integrity": "sha512-nVIZwtCjkC9YgvWkpM55B5rBhBYRZhAaJbgcFYXXsHnbZ9UZI9nnVWYZpBlCqv9ho2eZryPnWrZGsOdPwVWXWQ==", + "dev": true, "requires": { "is-equal-shallow": "^0.1.3" } @@ -23424,7 +23194,8 @@ "remove-trailing-separator": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz", - "integrity": "sha1-wkvOKig62tW8P1jg1IJJuSN52O8=" + "integrity": "sha1-wkvOKig62tW8P1jg1IJJuSN52O8=", + "dev": true }, "renderkid": { "version": "2.0.3", @@ -23459,12 +23230,14 @@ "repeat-element": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.3.tgz", - "integrity": "sha512-ahGq0ZnV5m5XtZLMb+vP76kcAM5nkLqk0lpqAuojSKGgQtn4eRi4ZZGm2olo2zKFH+sMsWaqOCW1dqAnOru72g==" + "integrity": "sha512-ahGq0ZnV5m5XtZLMb+vP76kcAM5nkLqk0lpqAuojSKGgQtn4eRi4ZZGm2olo2zKFH+sMsWaqOCW1dqAnOru72g==", + "dev": true }, "repeat-string": { "version": "1.6.1", "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz", - "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc=" + "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc=", + "dev": true }, "repeating": { "version": "2.0.1", @@ -23605,15 +23378,6 @@ } } }, - "resolve-dir": { - "version": "0.1.1", - "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz", - "integrity": "sha1-shklmlYC+sXFxJatiUpujMQwJh4=", - "requires": { - "expand-tilde": "^1.2.2", - "global-modules": "^0.2.3" - } - }, "resolve-from": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-1.0.1.tgz", @@ -24441,9 +24205,9 @@ "integrity": "sha512-VUJ49FC8U1OxwZLxIbTTrDvLnf/6TDgxZcK8wxR8zs13xpx7xbG60ndBlhNrFi2EMuFRoeDoJO7wthSLq42EjA==" }, "simple-concat": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/simple-concat/-/simple-concat-1.0.0.tgz", - "integrity": "sha1-c0TLuLbib7J9ZrL8hvn21Zl1IcY=" + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/simple-concat/-/simple-concat-1.0.1.tgz", + "integrity": "sha512-cSFtAPtRhljv69IK0hTVZQ+OfE9nePi/rtJmw5UjHeVyVroEqJXP1sFztKUy1qU+xvz3u/sfYJLa947b7nAN2Q==" }, "simple-get": { "version": "2.8.1", @@ -24741,14 +24505,6 @@ "integrity": "sha512-qnQ7gVMxGNxsiL4lEuJwe/To8UnK7fAnmbGEEH8RpLouuKbeEm0lhbQVFIrNSuB+G7tVrAlVsZgETT5nljf+Iw==", "dev": true }, - "source-map": { - "version": "0.1.43", - "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz", - "integrity": "sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y=", - "requires": { - "amdefine": ">=0.0.4" - } - }, "source-map-explorer": { "version": "1.8.0", "resolved": "https://registry.npmjs.org/source-map-explorer/-/source-map-explorer-1.8.0.tgz", @@ -25302,11 +25058,6 @@ "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz", "integrity": "sha1-PFMZQukIwml8DsNEhYwobHygpgo=" }, - "style-attr": { - "version": "1.3.0", - "resolved": "https://registry.npmjs.org/style-attr/-/style-attr-1.3.0.tgz", - "integrity": "sha512-srFr54gzEZoy73WgYfnbxCAtNCzF0Hn5RGzK7gi/0G6ttZd9v3WZFGY4ed5ABr43dbGjPNr4T46geUxxUP9i6w==" - }, "style-loader": { "version": "0.23.0", "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.23.0.tgz", @@ -25476,6 +25227,16 @@ "resolved": "https://registry.npmjs.org/stylis-rule-sheet/-/stylis-rule-sheet-0.0.10.tgz", "integrity": "sha512-nTbZoaqoBnmK+ptANthb10ZRZOGC+EmTLLUxeYIuHNkEKcmKgXX1XWKkUBT2Ac4es3NybooPe0SmvKdhKJZAuw==" }, + "super-animejs": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/super-animejs/-/super-animejs-3.1.0.tgz", + "integrity": "sha512-6MFAFJDRuvwkovxQZPruuyHinTa4rgj4hNLOndjcYYhZLckoXtVRY9rJPuq8p6c/tgZJrFYEAYAfJ2/hhNtUCA==" + }, + "super-three": { + "version": "0.111.6", + "resolved": "https://registry.npmjs.org/super-three/-/super-three-0.111.6.tgz", + "integrity": "sha512-/OJTOBpmm7MRx8R0G5Zr9sX8EqsELy7SwATb5n0FP145QsrP134pY2W489sfkJYqZmGkpHmG1ulQ0M94icThBw==" + }, "supports-color": { "version": "7.1.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.1.0.tgz", @@ -25936,9 +25697,8 @@ "integrity": "sha512-fihjYVjCmQbI03zt1+YCl/m+UrZCcDHFNLexgqBOIdPwnO6PYkQaYUsIbqtvNNse+BiMeu+pQWzZn9/NSnIv6A==" }, "three-bmfont-text": { - "version": "2.3.0", - "resolved": "https://registry.npmjs.org/three-bmfont-text/-/three-bmfont-text-2.3.0.tgz", - "integrity": "sha512-HG6QHR129cNMGBhMgLsyKJiNW5r2XI+2P1JyjJl/9+D1e0iySzVZl3r8peTFpoJzPODl5Ckb8nu0U1zWjc6dNg==", + "version": "github:dmarcos/three-bmfont-text#1babdf8507c731a18f8af3b807292e2b9740955e", + "from": "github:dmarcos/three-bmfont-text#1babdf8507c731a18f8af3b807292e2b9740955e", "requires": { "array-shuffle": "^1.0.1", "inherits": "^2.0.1", @@ -25946,13 +25706,12 @@ "nice-color-palettes": "^1.0.1", "object-assign": "^4.0.1", "quad-indices": "^2.0.1", - "three-buffer-vertex-data": "^1.0.0" + "three-buffer-vertex-data": "github:dmarcos/three-buffer-vertex-data#69378fc58daf27d3b1d930df9f233473e4a4818c" } }, "three-buffer-vertex-data": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/three-buffer-vertex-data/-/three-buffer-vertex-data-1.1.0.tgz", - "integrity": "sha1-zyKOeEJ2ZYhLlhpMq+H4XtOfgrE=", + "version": "github:dmarcos/three-buffer-vertex-data#69378fc58daf27d3b1d930df9f233473e4a4818c", + "from": "github:dmarcos/three-buffer-vertex-data#69378fc58daf27d3b1d930df9f233473e4a4818c", "requires": { "flatten-vertex-data": "^1.0.0" } @@ -26212,7 +25971,13 @@ "typedarray": { "version": "0.0.6", "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz", - "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=" + "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=", + "dev": true + }, + "ua-parser-js": { + "version": "0.7.24", + "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.24.tgz", + "integrity": "sha512-yo+miGzQx5gakzVK3QFfN0/L9uVhosXBBO7qmnk7c2iw1IhL212wfA3zbnI54B0obGwC/5NWub/iT9sReMx+Fw==" }, "uglify-js": { "version": "3.4.10", @@ -26917,13 +26682,15 @@ "version": "2.1.1", "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=", - "dev": true + "dev": true, + "optional": true }, "is-glob": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.1.tgz", "integrity": "sha512-5G0tKtBTFImOqDnLB2hG6Bp2qcKEFduo4tZu9MT/H6NQv/ghhy30o55ufafxJ/LdH79LLs2Kfrn85TLKyA7BUg==", "dev": true, + "optional": true, "requires": { "is-extglob": "^2.1.1" } @@ -26939,7 +26706,8 @@ "version": "3.0.0", "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz", "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==", - "dev": true + "dev": true, + "optional": true }, "readdirp": { "version": "3.4.0", diff --git a/package.json b/package.json index 370e83f6..9e95f806 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "myr", - "version": "2.2.0", + "version": "2.3.0", "private": false, "engines": { "node": "12.18.2" @@ -17,13 +17,13 @@ }, "dependencies": { "@material-ui/core": "^4.11.2", - "aframe": "^0.8.2", + "aframe": "^1.0.4", "aframe-animation-component": "^5.0.0", "aframe-environment-component": "^1.0.0", "aframe-extras": "^4.1.2", "aframe-physics-system": "^3.2.0", "aframe-react": "^4.4.0", - "bootstrap": "^4.0.0", + "bootstrap": "^4.6.0", "browserslist": "^4.6.2", "cannon": "^0.6.2", "create-react-app": "^3.0.1", @@ -49,7 +49,8 @@ "socket.io-client": "^2.3.0", "source-map-explorer": "^1.6.0", "styled-components": "^4.0.3", - "three": "^0.98.0" + "three": "^0.98.0", + "ua-parser-js": "^0.7.24" }, "scripts": { "start": "react-scripts start", diff --git a/src/actions/sceneActions.js b/src/actions/sceneActions.js index 3a3b0391..4dae10c5 100644 --- a/src/actions/sceneActions.js +++ b/src/actions/sceneActions.js @@ -60,10 +60,6 @@ export function changeView() { return { type: types.CHANGE_VIEW }; } -export function toggleFly() { - return { type: types.TOGGLE_FLY }; -} - export function toggleFloor() { return { type: types.TOGGLE_FLOOR }; } @@ -106,7 +102,6 @@ export default { setCamera, changePerspective, changeView, - toggleFly, toggleFloor, loadSettings, changeSettings, diff --git a/src/components/structural/View.js b/src/components/structural/View.js index 658117d1..f14ea02b 100644 --- a/src/components/structural/View.js +++ b/src/components/structural/View.js @@ -1,11 +1,10 @@ import React, { Component, Fragment } from "react"; +import { browserType } from "../../utils/browserType"; import "aframe"; -import "aframe-animation-component"; import "three-pathfinding/dist/three-pathfinding"; import "aframe-extras/dist/aframe-extras.min.js"; import "aframe-physics-system"; import "aframe-environment-component"; -import * as THREE from "three"; /** * The View component return the aframe representation of the scene. This @@ -31,7 +30,7 @@ class View extends Component { } window.addEventListener("keydown", function (e) { //KEYS: left and right: 37, 39; up and down: 38, 40; space: 32 - if ([38, 40].indexOf(e.keyCode) > -1) { + if ([32, 38, 40].indexOf(e.keyCode) > -1 && e.target === document.body) { e.preventDefault(); } }, false); @@ -55,9 +54,6 @@ class View extends Component { // Dispatch/Trigger/Fire the event document.dispatchEvent(event); - - let el = document.getElementById("rig"); - el.components["movement-controls"].velocity = new THREE.Vector3(0, 0, 0); } } @@ -158,18 +154,18 @@ class View extends Component { //ambient light doesn't have an indicator switch(ent.light.type){ case "point": - return ; + return ; case "spot": let target = true; if(!ent.light.target) { position = ""; target = false; } - return ; + return ; case "directional": - return ; + return ; case "hemisphere": - return ; + return ; default: } } @@ -214,8 +210,7 @@ class View extends Component { + look-controls="pointerLockEnabled: true"> { - return ( - - - - - - ); + switch(browserType()) { + case "mobile": + return ( + + + + + + ); + case "vr": + return ( + + + + + + ); + case "desktop": + default: + return ( + + + + + + ); + } } @@ -251,32 +281,29 @@ class View extends Component { if (this.props.sceneConfig.settings.showCoordHelper) { return ( - - - + + + + value="- X X +"> + value="+ Z Z -"> + value=" Y + "> ); } else { @@ -307,48 +334,40 @@ class View extends Component { /* eslint-disable */ return ( !this.state.welcomeOpen ? - - - - - - {this.props.assets ? this.props.assets.map((x) => this.assetsHelper(x)) : null} - - - - - - {this.props.sceneConfig.settings.defaultLight ? - - - - - : null - } - {this.props.sceneConfig.settings.lightIndicator||this.props.sceneConfig.settings.showCoordHelper ? - - - + + + + + + {this.props.assets ? this.props.assets.map((x) => this.assetsHelper(x)) : null} + + + + + {this.props.sceneConfig.settings.defaultLight ? + + + - : null} - { // create the entities - Object.keys(this.props.objects).map(it => { - return this.helper(this.props.objects[it]); - }) - } - - - {this.props.sceneConfig.settings.camConfig === 1 ? - - - - - - - - : null - } - + : null + } + { // create the entities + Object.keys(this.props.objects).map(it => { + return this.helper(this.props.objects[it]); + }) + } + + {this.props.sceneConfig.settings.camConfig === 1 ? + + + + + + + + : null + } + : null ); diff --git a/src/components/structural/WelcomeScene.js b/src/components/structural/WelcomeScene.js index 979f604a..5b76ad15 100644 --- a/src/components/structural/WelcomeScene.js +++ b/src/components/structural/WelcomeScene.js @@ -1,6 +1,57 @@ import React, { Component } from "react"; +import { browserType } from "../../utils/browserType"; class WelcomeScene extends Component { + createCam = () => { + switch(browserType()) { + case "mobile": + return ( + + + + + + ); + case "vr": + return ( + + + + + + ); + case "desktop": + default: + return ( + + + + + + ); + } + } + render() { return ( @@ -8,18 +59,7 @@ class WelcomeScene extends Component { - - - - - + { const sceneSettings = this.props.scene.settings; - return [sceneSettings.canFly, sceneSettings.floorColor, + return [ sceneSettings.floorColor, sceneSettings.showCoordHelper, sceneSettings.showFloor, sceneSettings.skyColor, sceneSettings.viewOnly]; }; diff --git a/src/components/structural/header/MyrTour.js b/src/components/structural/header/MyrTour.js index 6f748816..9d1ec991 100644 --- a/src/components/structural/header/MyrTour.js +++ b/src/components/structural/header/MyrTour.js @@ -2,6 +2,7 @@ import React, { Component } from "react"; import Tour from "reactour"; import { Button } from "@material-ui/core"; import * as layoutTypes from "../../../constants/LayoutTypes"; +import { TourSteps } from "../../../myr/tour"; class MyrTour extends Component { constructor(props) { @@ -25,7 +26,7 @@ class MyrTour extends Component { {!isDisabled ? { this.setState({ viewOnlyOnOpen: this.props.viewOnly }); @@ -54,54 +55,28 @@ class MyrTour extends Component { } } -const steps = [ - { - selector: "#ace-editor", - content: "This is the editor. You can create 3D scenes using JavaScript " + - "and a special set of instructions or functions to MYR.\n The editor can be " + - "toggled on and off by opening the settings menu in the top right and " + - "clicking the \"View Editor\" switch." - }, - { - selector: "#play-btn", - content: "The Play button will render the scene." - }, - { - selector: "#stop-btn", - content: "The Stop button will stop the scene. \n Use this to save battery." - }, - { - selector: "#scene", - content: "The View is where you can see your work. \n Click the goggle to view in VR." - }, - { - selector: "#new-btn", - content: "Create a new scene from scratch. Be sure to save first!", - }, - { - selector: "#save-btn", - content: "Save your work.", - }, - { - selector: "#open-btn", - content: "See previous work and view examples.", - }, - { - selector: "#ref-btn", - content: "Use the Reference to see all MYR has to offer.", - }, - { - selector: "#configure-scene", - content: "Modify and share your scene including setting the background color, enabling the grid, and enabling flying.", - }, - { - selector: "#select-course", - content: "View the list of available courses to get you started on using MYR.", - }, - { - selector: "#user", - content: "You can log in with a Google account in order to save your scenes.", - }, -]; +const formatLineBreaks = (string) => { + if (typeof string !== "string") { + return string; + } + else { + return ( +
+ { + string.split("\n").map( (i, key) => { + return
{i}
; + }) + } +
+ ); + } +}; + +const formatSteps = (steps) => { + return steps.map( (step) => { + step.content = formatLineBreaks(step.content); + return step; + }); +}; export default MyrTour; diff --git a/src/components/structural/header/SceneConfigMenu.js b/src/components/structural/header/SceneConfigMenu.js index c9cfc549..936d7425 100644 --- a/src/components/structural/header/SceneConfigMenu.js +++ b/src/components/structural/header/SceneConfigMenu.js @@ -268,32 +268,7 @@ class ConfigModal extends Component { ); }; - /** - * Toggles the ability to fly in the scene - */ - flyToggle = () => { - let style = this.props.scene.settings.canFly ? btnStyle.on : btnStyle.off; - style = { ...btnStyle.base, ...style }; - return ( - { - this.props.handleRender(); - this.props.sceneActions.toggleFly(); - }} > - { - this.props.scene.settings.canFly - ? toggle_on - : toggle_off - } - Flying - - ); - }; - - /** - * Toggles the grid on and off - */ + // Toggles the grid on and off gridToggle = () => { let style = this.props.scene.settings.showCoordHelper ? btnStyle.on : btnStyle.off; style = { ...btnStyle.base, ...style }; @@ -564,9 +539,6 @@ class ConfigModal extends Component {
Camera Control
-
- -
diff --git a/src/constants/ActionTypes.js b/src/constants/ActionTypes.js index 614467f3..b087dc8c 100644 --- a/src/constants/ActionTypes.js +++ b/src/constants/ActionTypes.js @@ -33,7 +33,6 @@ export const CHANGE_CAM_MODE = "CHANGE_CAM_MODE"; export const SET_CAMERA = "SET_CAMERA"; export const CHANGE_PERSPECTIVE = "CHANGE_PERSPECTIVE"; export const CHANGE_VIEW = "CHANGE_VIEW"; -export const TOGGLE_FLY = "TOGGLE_FLY"; export const TOGGLE_FLOOR = "TOGGLE_FLOOR"; export const LOAD_SETTINGS = "LOAD_SETTINGS"; export const CHANGE_SETTINGS = "CHANGE_SETTINGS"; diff --git a/src/index.js b/src/index.js index d39c89b8..04e52654 100644 --- a/src/index.js +++ b/src/index.js @@ -1,7 +1,8 @@ import React from "react"; import ReactDOM from "react-dom"; import { Provider } from "react-redux"; -import "./utils/AframeReg"; +import "./utils/AFramePhysics"; +import "./utils/WASDPlusControls"; import "./utils/AframeRegIndicator"; import "bootstrap/dist/css/bootstrap.css"; import "./css/App.css"; diff --git a/src/myr/Myr.js b/src/myr/Myr.js index 9a8fc443..8b231cf6 100644 --- a/src/myr/Myr.js +++ b/src/myr/Myr.js @@ -35,6 +35,8 @@ class Myr { phiLength: 360, loop: true, textureColoring: false, + textureRepeatWidth: 1, + textureRepeatHeight: 1, duration: 1000, magnitude: { spin: 360, @@ -113,6 +115,8 @@ class Myr { phiLength: 360, loop: true, textureColoring: false, + textureRepeatWidth: 1, + textureRepeatHeight: 1, duration: 1000, magnitude: { spin: 360, @@ -166,6 +170,8 @@ class Myr { phiLength: 360, loop: true, textureColoring: false, + textureRepeatWidth: 1, + textureRepeatHeight: 1, duration: 1000, magnitude: { spin: 360, @@ -640,22 +646,24 @@ class Myr { return this.cursor.color; } - setTexture = (texture = "") => { + setTexture = (texture = "", w = 1, h = 1) => { let textures = TexturePack(); let textureTitle = [...textures.TexturePack.map(obj => obj.title)]; let textureURL = [...textures.TexturePack.map(obj => obj.url)]; let urlregex = /^(http(s?):)([/|.|\w|\s|-])*\.(?:jpg|gif|png)/; - if (textureURL[textureTitle.indexOf(texture)] !== undefined) { - this.cursor.texture = textureURL[textureTitle.indexOf(texture)]; + if (textureURL[textureTitle.indexOf(texture.toLowerCase())] !== undefined) { + this.cursor.texture = textureURL[textureTitle.indexOf(texture.toLowerCase())]; } else if(urlregex.test(texture) || (texture === "")) { this.cursor.texture = texture; } else { console.error("Not a usable texture or URL."); - this.cursor.texture = ""; + throw new Error("Not a usable texture or URL."); } + this.cursor.textureRepeatWidth = w; + this.cursor.textureRepeatHeight = h; return this.cursor.texture; } @@ -836,7 +844,7 @@ class Myr { position: { ...this.cursor.position }, rotation: this.cursor.rotation, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); @@ -854,7 +862,7 @@ class Myr { position: this.cursor.position, rotation: this.cursor.rotation, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); } @@ -871,7 +879,7 @@ class Myr { position: this.cursor.position, rotation: this.cursor.rotation, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); } @@ -888,7 +896,7 @@ class Myr { position: this.cursor.position, rotation: this.cursor.rotation, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); } @@ -906,7 +914,7 @@ class Myr { position: this.cursor.position, rotation: this.cursor.rotation, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); } @@ -923,7 +931,7 @@ class Myr { position: this.cursor.position, rotation: this.cursor.rotation, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); } @@ -940,7 +948,7 @@ class Myr { position: this.cursor.position, rotation: this.cursor.rotation, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); } @@ -959,7 +967,7 @@ class Myr { position: this.cursor.position, rotation: this.cursor.rotation, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); } @@ -976,7 +984,7 @@ class Myr { position: this.cursor.position, rotation: this.cursor.rotation, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); } @@ -993,7 +1001,7 @@ class Myr { position: this.cursor.position, rotation: this.cursor.rotation, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); } @@ -1010,7 +1018,7 @@ class Myr { position: this.cursor.position, rotation: this.cursor.rotation, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); } @@ -1027,7 +1035,7 @@ class Myr { position: this.cursor.position, rotation: this.cursor.rotation, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); } @@ -1044,7 +1052,7 @@ class Myr { position: this.cursor.position, rotation: this.cursor.rotation, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); } @@ -1090,7 +1098,7 @@ class Myr { position: this.cursor.position, rotation: this.cursor.rotation, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); } @@ -1109,7 +1117,7 @@ class Myr { p: 2, q: 3, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); } @@ -1126,7 +1134,7 @@ class Myr { position: this.cursor.position, rotation: this.cursor.rotation, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); } @@ -1145,7 +1153,7 @@ class Myr { position: this.cursor.position, rotation: this.cursor.rotation, scale: this.cursor.scale, - material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; opacity: ${1 - this.cursor.transparency};`, + material: ((this.cursor.texture === "" || this.cursor.textureColoring) ? `color: ${this.cursor.color};` : "color: white;") + `side: double; src: ${this.cursor.texture}; repeat: ${this.cursor.textureRepeatWidth + " " + this.cursor.textureRepeatHeight}; opacity: ${1 - this.cursor.transparency};`, }; return this.mergeProps(base, params); } diff --git a/src/myr/reference.js b/src/myr/reference.js index b5749ba5..712703ff 100644 --- a/src/myr/reference.js +++ b/src/myr/reference.js @@ -270,8 +270,8 @@ let transformations = [ }, { name: "setTexture", - parameters: [{type: "string", name: "texture"}], - description: The setTexture function changes the texture of the cursor. The texture's normal color is displayed when setTextureColoring() is false, otherwise the texture will be affected by the current color. Textures can be applied either by using the name of one of or by inserting a valid url (e.g. "bricks" or "https://learnmyr.org/img/MYR-Logo.png"). An empty setTexture() or setTexture("") statement will remove the current texture., + parameters: [{type: "string", name: "texture"}, {type: "number", name: "widthRepeat"}, {type: "number", name: "heightRepeat"}], + description: The setTexture function changes the texture of the cursor. The texture's normal color is displayed when setTextureColoring() is false, otherwise the texture will be affected by the current color. Textures can be applied either by using the name of one of or by inserting a valid url (e.g. "bricks" or "https://learnmyr.org/img/MYR-Logo.png"). WidthRepeat and heightRepeat will change how many times the texture is displayed on the object in each direction. If widthRepeat and heightRepeat are not declared they will be set to default settings. Depending on the policy of the website they’re from, image URLs may not be usable, which will result in a blank Texture and Color. An empty setTexture() or setTexture("") statement will remove the current texture., example: "setTexture" }, { @@ -521,7 +521,7 @@ let animations = [ { name: "getMagnitude", parameters: [], - desription: The getMagnitude function returns the current magnitude attribute of the cursor. The magnitude can be changed by the setMagnitude function. + description: The getMagnitude function returns the current magnitude attribute of the cursor. The magnitude can be changed by the setMagnitude function. }, { name: "spin", diff --git a/src/myr/tour.js b/src/myr/tour.js new file mode 100644 index 00000000..9add7ad4 --- /dev/null +++ b/src/myr/tour.js @@ -0,0 +1,57 @@ +export const TourSteps = [ + { + selector: "#ace-editor", + content: "This is the editor. You can create 3D scenes using JavaScript " + + "and a special set of instructions or functions to MYR.\nThe editor can be " + + "toggled on and off by opening the settings menu in the top right and " + + "clicking the \"View Editor\" switch." + }, + { + selector: "#play-btn", + content: "The Play button will render the scene." + }, + { + selector: "#stop-btn", + content: "The Stop button will stop the scene. \nUse this to save battery." + }, + { + selector: "#scene", + content: "The View is where you can see your work. " + + "You can navigate the scene with the following controls: \n" + + "W: Forward \n" + + "A: Left\n" + + "S: Backward\n" + + "D: Right\n" + + "Space: Fly Upwards\n" + + "Shift: Fly Downwards\n" + + "To view the scene in VR, click the goggles!" + }, + { + selector: "#new-btn", + content: "Create a new scene from scratch. Be sure to save first!", + }, + { + selector: "#save-btn", + content: "Save your work.", + }, + { + selector: "#open-btn", + content: "See previous work and view examples.", + }, + { + selector: "#ref-btn", + content: "Use the Reference to see all MYR has to offer.", + }, + { + selector: "#configure-scene", + content: "Modify and share your scene including setting the background color, enabling the grid, and hiding the editor pane.", + }, + { + selector: "#select-course", + content: "View the list of available courses to get you started on using MYR.", + }, + { + selector: "#user", + content: "You can log in with a Google account in order to save your scenes.", + }, +]; \ No newline at end of file diff --git a/src/reducers/scene.js b/src/reducers/scene.js index fe76d3df..9cc8cfd7 100644 --- a/src/reducers/scene.js +++ b/src/reducers/scene.js @@ -4,9 +4,8 @@ export const DEF_SETTINGS = { skyColor: "white", floorColor: "#222", camConfig: 0, - showCoordHelper: false, - canFly: false, - showFloor: true, + showCoordHelper: true, + showFloor: false, cameraPosition: "0 1.6 3", viewOnly: false, defaultLight: true, @@ -51,14 +50,6 @@ export default function scene(state = initial_state, action) { showCoordHelper: !state.settings.showCoordHelper } }; - case types.TOGGLE_FLY: - return { - ...state, - settings: { - ...state.settings, - canFly: !state.settings.canFly - } - }; case types.SET_CAMERA: let camPos = `${action.x || 0} ${action.y + (Math.random() / 10) || 1.6} ${action.z || 0}`; return { @@ -176,4 +167,4 @@ export default function scene(state = initial_state, action) { default: return state; } -} \ No newline at end of file +} diff --git a/src/tests/App.test.js b/src/tests/App.test.js index ea0b3e99..3ea7ca6b 100644 --- a/src/tests/App.test.js +++ b/src/tests/App.test.js @@ -38,7 +38,6 @@ const generateMockProps = () => { setCamera: jest.fn(), changePerspective: jest.fn(), changeView: jest.fn(), - toggleFly: jest.fn(), toggleFloor: jest.fn(), loadSettings: jest.fn(), changeSetting: jest.fn(), @@ -65,7 +64,6 @@ const generateMockProps = () => { floorColor: "#222", camConfig: 0, showCoordHelper: false, - canFly: false, showFloor: true, cameraPosition: "0 1.6 3", viewOnly: false, @@ -317,9 +315,8 @@ describe("Scene Reducer", () => { skyColor: "white", floorColor: "#222", camConfig: 0, - showCoordHelper: false, - canFly: false, - showFloor: true, + showCoordHelper: true, + showFloor: false, cameraPosition: "0 1.6 3", viewOnly: false, defaultLight: true, diff --git a/src/tests/Myr.test.js b/src/tests/Myr.test.js index 314653a2..d9f7378a 100644 --- a/src/tests/Myr.test.js +++ b/src/tests/Myr.test.js @@ -27,6 +27,8 @@ const defaultCursor = { phiLength: 360, loop: true, textureColoring: false, + textureRepeatWidth: 1, + textureRepeatHeight: 1, duration: 1000, magnitude: { spin: 360, @@ -51,8 +53,10 @@ describe("Updates to Myr's Model", () => { }); it("should set the texture by using a title and getTexture() should return that title", () => { - myr.setTexture("bricks"); + myr.setTexture("bricks", 2, 2); expect(myr.cursor.texture).toEqual("/img/textures/bricks.jpg"); + expect(myr.cursor.textureRepeatWidth).toEqual(2); + expect(myr.cursor.textureRepeatHeight).toEqual(2); let getTest = myr.getTexture(); expect(getTest).toEqual("bricks"); }); @@ -62,11 +66,13 @@ describe("Updates to Myr's Model", () => { expect(myr.cursor.texture).toEqual("https://learnmyr.org/img/MYR-Logo.png"); }); - it("improper texture should return empty texture", () => { - myr.setTexture("asdfghjkl"); - expect(myr.cursor.texture).toEqual(""); - let getUndefinedTest = myr.getTexture(); - expect(getUndefinedTest).toEqual(""); + it("improper texture should throw an error", () => { + try { + myr.setTexture("asdfghjkl"); + } + catch(err) { + expect(err).toEqual(Error("Not a usable texture or URL.")); + } }); it("setTextureColoring(true) should allow a textured object to have a color other than white", () => { diff --git a/src/utils/AframeReg.js b/src/utils/AFramePhysics.js similarity index 66% rename from src/utils/AframeReg.js rename to src/utils/AFramePhysics.js index ff7fd6c3..5172cb3a 100644 --- a/src/utils/AframeReg.js +++ b/src/utils/AFramePhysics.js @@ -1,5 +1,5 @@ import AFRAME from "aframe"; -import * as THREE from "three"; +const THREE = AFRAME.THREE; AFRAME.registerComponent("force-pushable", { schema: { @@ -24,50 +24,34 @@ AFRAME.registerComponent("force-pushable", { } }); -//This set aframe entity to different layer (range from 0-31) -//all the regular MYR entities will goes to layer 0 -//And other, such as grid, light indicator will goes to layer 1 so it won't take effect of user created light -AFRAME.registerComponent("layer",{ + +//change the type of the material to the MeshBasicMaterial +AFRAME.registerComponent("basicmaterial",{ schema:{ - type:{ - type:"string", - default: "mesh" - }, - layer:{ - type:"number", - default: 0 - }, + default:"" }, init: function(){ - let obj = this.el.getObject3D(this.data.type); - if(this.data.type === "group"){ - obj.children.forEach((child)=>{ - child.layers.set(this.data.layer); - }); - } else { - obj.layers.set(this.data.layer); - } + const color = this.el.getObject3D("mesh").material.color; + this.el.getObject3D("mesh").material = new THREE.MeshBasicMaterial({ + color:color, + }); } -}); +}); -//Attached to the a-scene. Display aframe entities in different layer in scene every frame -AFRAME.registerComponent("scenelayer",{ +//change the material of a-grid to MeshBasicMaterial +AFRAME.registerComponent("gridmaterial",{ schema:{ default:"" }, init: function(){ - this.renderer = this.el.renderer; - this.camera = this.el.camera; - this.scene = this.el.sceneEl.object3D; - }, - tick: function(){ - this.renderer.autoClear = true; - this.camera.layers.set(1); - this.renderer.render(this.scene, this.camera); - - this.renderer.autoClear = false; - this.camera.layers.set(0); - this.renderer.render(this.scene, this.camera); + const texture = new THREE.TextureLoader().load("https://cdn.jsdelivr.net/gh/donmccurdy/aframe-extras@v1.16.3/assets/grid.png"); + texture.repeat = new THREE.Vector2(75,75); + texture.wrapS = THREE.RepeatWrapping; + texture.wrapT = THREE.RepeatWrapping; + + this.el.getObject3D("mesh").material = new THREE.MeshBasicMaterial({ + map: texture + }); } }); diff --git a/src/utils/AframeRegIndicator.js b/src/utils/AframeRegIndicator.js index c2a9dd51..0caac3b6 100644 --- a/src/utils/AframeRegIndicator.js +++ b/src/utils/AframeRegIndicator.js @@ -1,5 +1,5 @@ import AFRAME from "aframe"; -import * as THREE from "three"; +const THREE = AFRAME.THREE; AFRAME.registerComponent("spotlightindicator",{ diff --git a/src/utils/WASDPlusControls.js b/src/utils/WASDPlusControls.js new file mode 100644 index 00000000..a03fd75f --- /dev/null +++ b/src/utils/WASDPlusControls.js @@ -0,0 +1,193 @@ + +import AFRAME from "aframe"; +const THREE = AFRAME.THREE; +const bind = AFRAME.utils.bind; +const shouldCaptureKeyEvent = AFRAME.utils.shouldCaptureKeyEvent; + +const KEYS = [ + "KeyW", "KeyA", "KeyS", "KeyD", + "ArrowUp", "ArrowLeft", "ArrowRight", "ArrowDown", + "Space", "ShiftLeft", "ShiftRight" +]; + +const MAX_DELTA = 0.25; +const CLAMP_VELOCITY = 0.01; +const MOD_Y = 1.5; + +const isEmptyObject = (keys) => { + let key; + for (key in keys) { return false; } + return true; +}; + +AFRAME.registerComponent("wasd-plus-controls", { + schema: { + acceleration: {type: "number", default : 150}, + enabled : {type: "boolean", default : true}, + xInverted : {type: "boolean", default : false}, + yInverted : {type: "boolean", default : false}, + zInverted : {type: "boolean", default : false}, + }, + init: function() { + //tracks the state of keypresses + this.keys = {}; + this.easing = 1.1; + this.velocity = new THREE.Vector3(); + + this.onBlur = bind(this.onBlur, this); + this.onFocus = bind(this.onFocus, this); + this.onKeyDown = bind(this.onKeyDown, this); + this.onKeyUp = bind(this.onKeyUp, this); + this.onVisibilityChange = bind(this.onVisibilityChange, this); + this.attachVisibilityEventListeners(); + }, + + tick: function (time, delta) { + let el = this.el; + let velocity = this.velocity; + + if (!velocity["x"] && !velocity["y"] && !velocity["z"] && isEmptyObject(this.keys)) { return; } + + // Update velocity. + delta = delta / 1000; + this.updateVelocity(delta); + + if (!velocity["x"] && !velocity["y"] && !velocity["z"]) { return; } + + // Get movement vector and translate position. + el.object3D.position.add(this.getMovementVector(delta)); + }, + + remove: function () { + this.removeKeyEventListeners(); + this.removeVisibilityEventListeners(); + }, + + play: function () { + this.attachKeyEventListeners(); + }, + + pause: function () { + this.keys = {}; + this.removeKeyEventListeners(); + }, + + updateVelocity: function (delta) { + let data = this.data; + let keys = this.keys; + let velocity = this.velocity; + let acceleration; + let xSign; + let ySign; + let zSign; + + // If FPS too low, reset velocity. + if (delta > MAX_DELTA) { + velocity["x"] = 0; + velocity["y"] = 0; + velocity["z"] = 0; + return; + } + // https://gamedev.stackexchange.com/questions/151383/frame-rate-independant-movement-with-acceleration + let scaledEasing = Math.pow(1 / this.easing, delta * 60); + // Velocity Easing based on framerate + if (velocity["x"] !== 0) { + velocity["x"] -= velocity["x"] * scaledEasing; + } + if (velocity["y"] !== 0) { + velocity["y"] -= velocity["y"] * scaledEasing; + } + if (velocity["z"] !== 0) { + velocity["z"] -= velocity["z"] * scaledEasing; + } + + // Clamp velocity easing. + if (Math.abs(velocity["x"]) < CLAMP_VELOCITY) { velocity["x"] = 0; } + if (Math.abs(velocity["y"]) < CLAMP_VELOCITY) { velocity["y"] = 0; } + if (Math.abs(velocity["z"]) < CLAMP_VELOCITY) { velocity["z"] = 0; } + + if (!data.enabled) { return; } + + // Update velocity using keys pressed. + acceleration = data.acceleration; + xSign = data.xInverted ? -1 : 1; + if (keys.KeyA || keys.ArrowLeft) { velocity["x"] -= xSign * acceleration * delta; } + if (keys.KeyD || keys.ArrowRight) { velocity["x"] += xSign * acceleration * delta; } + + ySign = data.yInverted ? -1 : 1; + if (keys.ShiftLeft || keys.ShiftRight) { velocity["y"] -= ySign * acceleration * delta * MOD_Y; } + if (keys.Space) { velocity["y"] += ySign * acceleration * delta * MOD_Y; } + + zSign = data.zInverted ? -1 : 1; + if (keys.KeyW || keys.ArrowUp) { velocity["z"] -= zSign * acceleration * delta; } + if (keys.KeyS || keys.ArrowDown) { velocity["z"] += zSign * acceleration * delta; } + }, + + getMovementVector: function (delta) { + let directionVector = new THREE.Vector3(0, 0, 0); + let rotationEuler = new THREE.Euler(0, 0, 0); + let rotation = this.el.object3D.rotation; + let velocity = this.velocity; + + directionVector.copy(velocity); + directionVector.multiplyScalar(delta); + + // Absolute. + if (!rotation) { return directionVector; } + + // Transform direction relative to heading. + rotationEuler.set(0, rotation.y, 0); + directionVector.applyEuler(rotationEuler); + return directionVector; + }, + + attachVisibilityEventListeners: function () { + window.addEventListener("blur", this.onBlur); + window.addEventListener("focus", this.onFocus); + document.addEventListener("visibilitychange", this.onVisibilityChange); + }, + + removeVisibilityEventListeners: function () { + window.removeEventListener("blur", this.onBlur); + window.removeEventListener("focus", this.onFocus); + document.removeEventListener("visibilitychange", this.onVisibilityChange); + }, + + attachKeyEventListeners: function () { + window.addEventListener("keydown", this.onKeyDown); + window.addEventListener("keyup", this.onKeyUp); + }, + + removeKeyEventListeners: function () { + window.removeEventListener("keydown", this.onKeyDown); + window.removeEventListener("keyup", this.onKeyUp); + }, + + onBlur: function () { + this.pause(); + }, + + onFocus: function () { + this.play(); + }, + + onVisibilityChange: function () { + if (document.hidden) { + this.onBlur(); + } else { + this.onFocus(); + } + }, + + onKeyDown: function (event) { + if (!shouldCaptureKeyEvent(event)) { return; } + let code = event.code; + if (KEYS.includes(code)) { this.keys[code] = true; } + }, + + onKeyUp: function (event) { + if (!shouldCaptureKeyEvent(event)) { return; } + let code = event.code; + delete this.keys[code]; + } +}); \ No newline at end of file diff --git a/src/utils/browserType.js b/src/utils/browserType.js new file mode 100644 index 00000000..802d76f2 --- /dev/null +++ b/src/utils/browserType.js @@ -0,0 +1,12 @@ +import AFRAME from "aframe"; + +export const browserType = () => { + const device = AFRAME.utils.device; + + if(device.isMobile()) { + return "mobile"; + }else if(device.getVRDisplay() && device.getVRDisplay().length >= 0) { + return "vr"; + } + return "desktop"; +};