fix: move shaders to their own files

videojs · brandonocasey · Jan 22, 2018 · Jan 17, 2018 · Jan 17, 2018 · Jan 17, 2018
commit 977d8cb9a672d0a6b9f55b2ff4d92087451094cc
diff --git a/package.json b/package.json
@@ -61,7 +61,7 @@
     "watch:js-modules": "rollup -c scripts/modules.rollup.config.js -w",
     "watch:js-umd": "rollup -c scripts/umd.rollup.config.js -w",
     "watch:test": "rollup -c scripts/test.rollup.config.js -w",
-    "prepublishOnly": "npm run build",
+    "prepublish": "not-in-install && npm run build || in-install",
     "prepush": "npm run lint",
     "precommit": "npm run docs:toc && git add README.md"
   },
@@ -105,6 +105,7 @@
     "doctoc": "^1.3.0",
     "es5-shim": "^4.5.9",
     "husky": "^0.13.3",
+    "in-publish": "^2.0.0",
     "jsdoc": "^3.4.3",
     "karma": "~1.3.0",
     "karma-chrome-launcher": "^2.1.1",

diff --git a/src/plugin.js b/src/plugin.js
@@ -6,6 +6,9 @@ import * as THREE from 'three';
 import VRControls from 'three/examples/js/controls/VRControls.js';
 import VREffect from 'three/examples/js/effects/VREffect.js';
 import OrbitControls from 'three/examples/js/controls/OrbitControls.js';
+import rgbFragmentShader from './rgb-fragment-shader';
+import rgbaFragmentShader from './rgba-fragment-shader';
+import vertexShader from './vertex-shader';
 
 // import controls so they get regisetered with videojs
 import './cardboard-button';
@@ -387,45 +390,17 @@ class VR extends Plugin {
       this.videoTexture.format = THREE.RGBFormat;
     }
 
-    if (this.videoTexture.format === THREE.RGBAFormat && this.videoTexture.flipY === false) {
-      this.movieMaterial = new THREE.ShaderMaterial({
-        uniforms: {
-          texture: { value: this.videoTexture }
-        },
-        vertexShader: [
-          'varying vec2 vUV;',
-          'void main() {',
-          ' vUV = vec2( uv.x, 1.0 - uv.y );',
-          ' gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );',
-          '}'
-        ].join('\n'),
-        fragmentShader: [
-          'uniform sampler2D texture;',
-          'varying vec2 vUV;',
-          'void main() {',
-          ' gl_FragColor = texture2D( texture, vUV  ).bgra;',
-          '}'
-        ].join('\n')
-      });
-    } else if (this.videoTexture.format === THREE.RGBFormat && this.videoTexture.flipY === false) {
+    if ((this.videoTexture.format === THREE.RGBAFormat || this.videoTexture.format === THREE.RGBFormat) && this.videoTexture.flipY === false) {
+      let fragmentShader = rgbFragmentShader;
+
+      if (this.videoTexture.format === THREE.RGBAFormat) {
+        fragmentShader = rgbaFragmentShader;
+      }
+
       this.movieMaterial = new THREE.ShaderMaterial({
-        uniforms: {
-          texture: { value: this.videoTexture }
-        },
-        vertexShader: [
-          'varying vec2 vUV;',
-          'void main() {',
-          ' vUV = vec2( uv.x, 1.0 - uv.y );',
-          ' gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );',
-          '}'
-        ].join('\n'),
-        fragmentShader: [
-          'uniform sampler2D texture;',
-          'varying vec2 vUV;',
-          'void main() {',
-          ' gl_FragColor = texture2D( texture, vUV  );',
-          '}'
-        ].join('\n')
+        uniforms: {texture: {value: this.videoTexture}},
+        vertexShader,
+        fragmentShader
       });
     } else {
       this.movieMaterial = new THREE.MeshBasicMaterial({ map: this.videoTexture, overdraw: true, side: THREE.DoubleSide });

diff --git a/src/rgb-fragment-shader.js b/src/rgb-fragment-shader.js
@@ -0,0 +1,5 @@
+module.exports = `uniform sampler2D texture;
+varying vec2 vUV;
+void main() {
+  gl_FragColor = texture2D(texture, vUV);
+}`;
diff --git a/src/rgba-fragment-shader.js b/src/rgba-fragment-shader.js
@@ -0,0 +1,5 @@
+module.exports = `uniform sampler2D texture;
+varying vec2 vUV;
+void main() {
+  gl_FragColor = texture2D(texture, vUV).bgra;
+}`;
diff --git a/src/vertex-shader.js b/src/vertex-shader.js
@@ -0,0 +1,5 @@
+module.exports = `varying vec2 vUV;
+void main() {
+  vUV = vec2( uv.x, 1.0 - uv.y );
+  gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
+}`;