diff --git a/assets/img/enter-vr-button-background.png b/assets/img/enter-vr-button-background.png new file mode 100644 index 0000000..bb5b4dd Binary files /dev/null and b/assets/img/enter-vr-button-background.png differ diff --git a/package-lock.json b/package-lock.json index b693100..b138304 100644 --- a/package-lock.json +++ b/package-lock.json @@ -204,6 +204,11 @@ "uri-js": "^4.2.1" } }, + "ajv-errors": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/ajv-errors/-/ajv-errors-1.0.0.tgz", + "integrity": "sha1-7PAh+hCP0X37Xms4Py3SM+Mf/Fk=" + }, "ajv-keywords": { "version": "3.2.0", "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.2.0.tgz", @@ -9958,6 +9963,27 @@ "resolved": "https://registry.npmjs.org/style-attr/-/style-attr-1.3.0.tgz", "integrity": "sha512-srFr54gzEZoy73WgYfnbxCAtNCzF0Hn5RGzK7gi/0G6ttZd9v3WZFGY4ed5ABr43dbGjPNr4T46geUxxUP9i6w==" }, + "style-loader": { + "version": "0.23.1", + "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.23.1.tgz", + "integrity": "sha512-XK+uv9kWwhZMZ1y7mysB+zoihsEj4wneFWAS5qoiLwzW0WzSqMrrsIy+a3zkQJq0ipFtBpX5W3MqyRIBF/WFGg==", + "requires": { + "loader-utils": "^1.1.0", + "schema-utils": "^1.0.0" + }, + "dependencies": { + "schema-utils": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz", + "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==", + "requires": { + "ajv": "^6.1.0", + "ajv-errors": "^1.0.0", + "ajv-keywords": "^3.1.0" + } + } + } + }, "superagent": { "version": "3.8.3", "resolved": "https://registry.npmjs.org/superagent/-/superagent-3.8.3.tgz", @@ -10519,6 +10545,33 @@ } } }, + "url-loader": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/url-loader/-/url-loader-1.1.2.tgz", + "integrity": "sha512-dXHkKmw8FhPqu8asTc1puBfe3TehOCo2+RmOOev5suNCIYBcT626kxiWg1NBVkwc4rO8BGa7gP70W7VXuqHrjg==", + "requires": { + "loader-utils": "^1.1.0", + "mime": "^2.0.3", + "schema-utils": "^1.0.0" + }, + "dependencies": { + "mime": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/mime/-/mime-2.3.1.tgz", + "integrity": "sha512-OEUllcVoydBHGN1z84yfQDimn58pZNNNXgZlHXSboxMlFvgI6MXSWpWKpFRra7H1HxpVhHTkrghfRW49k6yjeg==" + }, + "schema-utils": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz", + "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==", + "requires": { + "ajv": "^6.1.0", + "ajv-errors": "^1.0.0", + "ajv-keywords": "^3.1.0" + } + } + } + }, "url-parse": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.4.1.tgz", diff --git a/package.json b/package.json index cc51697..bb5b4c2 100644 --- a/package.json +++ b/package.json @@ -39,6 +39,8 @@ "postcss-loader": "^2.0.9", "uglify-js": "git://github.com/mishoo/UglifyJS2#harmony", "uglifyjs-webpack-plugin": "0.4.6", + "url-loader": "^1.1.2", + "style-loader": "^0.23.1", "webpack": "2.3.3", "webpack-glsl-loader": "^1.0.1", "webpack-sources": "1.0.1" diff --git a/src/index.html b/src/index.html index f31d921..02d5d9d 100644 --- a/src/index.html +++ b/src/index.html @@ -33,7 +33,8 @@ proxy-event__cleargame1="event: pausemenuexit; as: cleargame; to: a-scene" proxy-event__cleargame2="event: pausemenurestart; as: cleargame; to: a-scene" search - fog="color: #a00; density: 0.035; type: exponential"> + fog="color: #a00; density: 0.035; type: exponential" + vr-mode-ui="enterVRButton: #vrButton"> @@ -200,5 +201,6 @@ {% endif %} + diff --git a/src/index.js b/src/index.js index 8885d74..04a8d32 100644 --- a/src/index.js +++ b/src/index.js @@ -17,3 +17,5 @@ require('aframe-thumb-controls-component'); requireAll(require.context('./components/', true, /\.js$/)); requireAll(require.context('./state/', true, /\.js$/)); + +require('./style.css'); diff --git a/src/style.css b/src/style.css new file mode 100644 index 0000000..12ee10b --- /dev/null +++ b/src/style.css @@ -0,0 +1,24 @@ +#vrButton { + position: absolute; + background: url(../assets/img/enter-vr-button-background.png) no-repeat; + background-size: cover; + border: 0; + cursor: pointer; + right: 20px; + bottom: 20px; + z-index: 9999999; + width: 84px; + height: 47px; +} + +#vrButton.a-hidden { + visibility: hidden; +} + +#vrButton:active { + border: 0; +} + +#vrButton:hover { + background-position: 0 -50.5px; +} \ No newline at end of file diff --git a/webpack.config.js b/webpack.config.js index a83901a..89d3f1b 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -92,6 +92,15 @@ module.exports = { exclude: /(node_modules)/, loader: 'webpack-glsl-loader', }, + { + test: /\.css$/, + exclude: /(node_modules)/, + use: ['style-loader', 'css-loader'], + }, + { + test: /\.(png|jpg)/, + loader: 'url-loader', + } ], }, resolve: {