Browse Source

Merge branch 'dev' of https://github.com/prabindh/three.js into dev

Mr.doob 11 years ago
parent
commit
aa54014e1d
2 changed files with 75 additions and 1 deletions
  1. 73 0
      examples/context_assignment_test.html
  2. 2 1
      src/renderers/WebGLRenderer.js

+ 73 - 0
examples/context_assignment_test.html

@@ -0,0 +1,73 @@
+<html>
+	<head>
+		<title>Pre-created Context Assignment Test</title>
+		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+    <script src="../build/three.js" type="text/javascript"></script>
+    
+    <script type="text/javascript">
+      var canvasgl;
+      var gl;
+      
+	function test_context_set() {
+	container = document.getElementById( 'container' );
+        canvasgl = document.getElementById("canvasgl");
+      
+        webgl_init(canvasgl);     
+
+	renderer = new THREE.WebGLRenderer( { givenGLContext:gl } );
+	renderer.setSize( 256, 256 );    
+	renderer.setClearColor(0xff0000, 1);; 
+	renderer.clear( );
+
+	//not needed when setting context from application
+	//container.appendChild( renderer.domElement );    
+      }
+      
+      	//GL init call
+	function webgl_init() {
+        gl = null;
+        
+        try {
+          gl = canvasgl.getContext("webgl") || canvasgl.getContext("experimental-webgl");
+        }
+        catch(e) {
+        }
+        
+        if (!gl) {
+          alert("Sorry, we tried. Could not get WebGL");
+        }
+      }
+    </script>
+  </head>
+	
+	<style type="text/css">
+    #canvas {
+      width: 256px;
+      height: 256px;
+      background-color: green;
+    }
+    #canvasgl {
+      width: 256px;
+      height: 256px;
+    }
+
+	</style>
+	
+	<body onload="test_context_set()">
+<div id="container">
+This test checks if Three.js successfully used the pre-created GL context passed from framework outside of Three.js. <br>For more information refer to <a href="https://github.com/mrdoob/three.js/pull/4353">this issue list in Three.js github</a><hr> The screen should show 2 square boxes of size 256x256, one filled by CSS in green color, and the other filled by WebGL in red color. If the red box is shown and same in size to the green box, it indicates that the test is successful.
+<br>
+<canvas id="canvas"></canvas>
+<br>
+The above is the CSS filled box, not GL, in Green color.
+<br><hr>
+The below is the GL filled box, not CSS, in Red color.
+<br>
+    <canvas id="canvasgl" >
+		</canvas>
+</div>
+<hr>
+Prabindh Sundareson
+	</body>
+</html>
+

+ 2 - 1
src/renderers/WebGLRenderer.js

@@ -12,6 +12,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 	parameters = parameters || {};
 	parameters = parameters || {};
 
 
 	var _canvas = parameters.canvas !== undefined ? parameters.canvas : document.createElement( 'canvas' ),
 	var _canvas = parameters.canvas !== undefined ? parameters.canvas : document.createElement( 'canvas' ),
+	_givenGLContext = parameters.givenGLContext !== undefined ? parameters.givenGLContext : null,
 
 
 	_precision = parameters.precision !== undefined ? parameters.precision : 'highp',
 	_precision = parameters.precision !== undefined ? parameters.precision : 'highp',
 
 
@@ -6517,7 +6518,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 				preserveDrawingBuffer: _preserveDrawingBuffer
 				preserveDrawingBuffer: _preserveDrawingBuffer
 			};
 			};
 
 
-			_gl = _canvas.getContext( 'webgl', attributes ) || _canvas.getContext( 'experimental-webgl', attributes );
+			_gl = _givenGLContext || _canvas.getContext( 'webgl', attributes ) || _canvas.getContext( 'experimental-webgl', attributes );
 
 
 			if ( _gl === null ) {
 			if ( _gl === null ) {