summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rwxr-xr-xo3d/samples/assets/poolballs.pngbin92695 -> 109874 bytes
-rw-r--r--o3d/samples/o3d-webgl-samples/simpleviewer/simpleviewer.html101
-rw-r--r--o3d/samples/o3d-webgl/client.js13
-rw-r--r--o3d/samples/o3d-webgl/pack.js10
-rw-r--r--o3d/samples/o3d-webgl/render_surface_set.js8
-rw-r--r--o3d/samples/o3d-webgl/texture.js5
6 files changed, 123 insertions, 14 deletions
diff --git a/o3d/samples/assets/poolballs.png b/o3d/samples/assets/poolballs.png
index 2f897cc..974618a 100755
--- a/o3d/samples/assets/poolballs.png
+++ b/o3d/samples/assets/poolballs.png
Binary files differ
diff --git a/o3d/samples/o3d-webgl-samples/simpleviewer/simpleviewer.html b/o3d/samples/o3d-webgl-samples/simpleviewer/simpleviewer.html
index 3c35beb..1bcf30c 100644
--- a/o3d/samples/o3d-webgl-samples/simpleviewer/simpleviewer.html
+++ b/o3d/samples/o3d-webgl-samples/simpleviewer/simpleviewer.html
@@ -84,7 +84,102 @@ var g_camera = {
var g_dragging = false;
+
+/**
+* Returns the absolute position of an element for certain browsers.
+* @param {HTML Element} element The element to get a position for.
+* @return {Object} An object containing x and y as the absolute position
+* of the given element.
+*/
+var getAbsolutePosition = function(element) {
+ var r = { x: element.offsetLeft, y: element.offsetTop };
+ if (element.offsetParent) {
+ var tmp = getAbsolutePosition(element.offsetParent);
+ r.x += tmp.x;
+ r.y += tmp.y;
+ }
+ return r;
+};
+
+/**
+ * Retrieve the coordinates of the given event relative to the center
+ * of the widget.
+ *
+ * @param {eventInfo} eventInfo As returned from
+ * CLIENT3DJS.util.getEventInfo.
+ * @param {HTML Element} opt_reference A DOM element whose position we want
+ * to transform the mouse coordinates to. If it is not passed in the
+ * element in the eventInfo will be used.
+ * @return {Object} An object containing keys 'x' and 'y'.
+ */
+var getRelativeCoordinates = function(eventInfo, opt_reference) {
+ var x, y;
+ event = eventInfo.event;
+ var element = eventInfo.element;
+ var reference = opt_reference || eventInfo.element;
+ if (!window.opera && typeof event.offsetX != 'undefined') {
+ // Use offset coordinates and find common offsetParent
+ var pos = { x: event.offsetX, y: event.offsetY };
+ // Send the coordinates upwards through the offsetParent chain.
+ var e = element;
+ while (e) {
+ e.mouseX = pos.x;
+ e.mouseY = pos.y;
+ pos.x += e.offsetLeft;
+ pos.y += e.offsetTop;
+ e = e.offsetParent;
+ }
+ // Look for the coordinates starting from the reference element.
+ var e = reference;
+ var offset = { x: 0, y: 0 }
+ while (e) {
+ if (typeof e.mouseX != 'undefined') {
+ x = e.mouseX - offset.x;
+ y = e.mouseY - offset.y;
+ break;
+ }
+ offset.x += e.offsetLeft;
+ offset.y += e.offsetTop;
+ e = e.offsetParent;
+ }
+ // Reset stored coordinates
+ e = element;
+ while (e) {
+ e.mouseX = undefined;
+ e.mouseY = undefined;
+ e = e.offsetParent;
+ }
+ } else {
+ // Use absolute coordinates
+ var pos = getAbsolutePosition(reference);
+ x = event.pageX - pos.x;
+ y = event.pageY - pos.y;
+ }
+ // Subtract distance to middle
+ return { x: x, y: y };
+};
+
+/**
+ * Returns an object with event, element, name and wheel in a semi cross
+ * browser way. Note: this can only be called from since an event because
+ * depending on the browser it expects that window.event is valid.
+ * @param {Event} event A mouse-related DOM event.
+ * @return {EventInfo} Info about the event.
+ */
+var getEventInfo = function(event) {
+ event = event ? event : window.event;
+ var elem = event.target ? event.target : event.srcElement;
+ var name = elem.id ? elem.id : ('->' + elem.toString());
+ var wheel = event.detail ? event.detail : -event.wheelDelta;
+ return { event: event,
+ element: elem,
+ name: name,
+ wheel: wheel };
+};
+
+
function startDragging(e) {
+ e = getRelativeCoordinates(getEventInfo(e));
g_lastRot = g_thisRot;
g_aball.click([e.x, e.y]);
@@ -93,6 +188,7 @@ function startDragging(e) {
}
function drag(e) {
+ e = getRelativeCoordinates(getEventInfo(e));
if (g_dragging) {
var rotationQuat = g_aball.drag([e.x, e.y]);
var rot_mat = g_quaternions.quaternionToRotation(rotationQuat);
@@ -105,6 +201,7 @@ function drag(e) {
}
function stopDragging(e) {
+ e = getRelativeCoordinates(getEventInfo(e));
g_dragging = false;
}
@@ -265,10 +362,10 @@ function onRender() {
* Creates the client area.
*/
function init() {
- // o3djs.webgl.makeClients(initStep2);
+ o3djs.webgl.makeClients(initStep2);
// The following call enables a debug WebGL context, which makes
// debugging much easier.
- o3djs.webgl.makeClients(initStep2, undefined, undefined, undefined, undefined, undefined, true);
+ // o3djs.webgl.makeClients(initStep2, undefined, undefined, undefined, undefined, undefined, true);
}
/**
diff --git a/o3d/samples/o3d-webgl/client.js b/o3d/samples/o3d-webgl/client.js
index 62ec060..04fed36 100644
--- a/o3d/samples/o3d-webgl/client.js
+++ b/o3d/samples/o3d-webgl/client.js
@@ -543,13 +543,13 @@ o3d.Client.prototype.fullscreen = false;
*/
o3d.Client.prototype.__defineGetter__('width',
function() {
- return this.gl.canvas.width;
+ return this.gl.hack_canvas.width;
}
);
o3d.Client.prototype.__defineSetter__('width',
function(x) {
- this.gl.canvas.width = x;
+ this.gl.hack_canvas.width = x;
}
);
@@ -560,13 +560,13 @@ o3d.Client.prototype.__defineSetter__('width',
*/
o3d.Client.prototype.__defineGetter__('height',
function() {
- return this.gl.canvas.height;
+ return this.gl.hack_canvas.height;
}
);
o3d.Client.prototype.__defineSetter__('height',
function(x) {
- this.gl.canvas.height = x;
+ this.gl.hack_canvas.height = x;
}
);
@@ -594,6 +594,9 @@ o3d.Client.prototype.initWithCanvas = function(canvas) {
return null;
}
+ // TODO(petersont): hack workaround for WebGLRenderingContext.canvas
+ // not being implemented in Firefox. Remove.
+ gl.hack_canvas = canvas;
this.gl = gl;
this.root.gl = gl;
this.renderGraphRoot.gl = gl;
@@ -710,7 +713,7 @@ o3d.Client.prototype.clearLostResourcesCallback =
*/
o3d.Client.prototype.setEventCallback =
function(type, handler) {
- var listener = this.gl.canvas;
+ var listener = this.gl.hack_canvas;
// TODO(petersont): Figure out a way for a canvas to listen to a key event
// directly.
if (type.substr(0, 3) == 'key') {
diff --git a/o3d/samples/o3d-webgl/pack.js b/o3d/samples/o3d-webgl/pack.js
index a5336ea..78ec5ee 100644
--- a/o3d/samples/o3d-webgl/pack.js
+++ b/o3d/samples/o3d-webgl/pack.js
@@ -210,8 +210,11 @@ o3d.Pack.prototype.createTexture2D =
if (width != undefined && height != undefined) {
this.gl.bindTexture(this.gl.TEXTURE_2D, texture.texture_);
+ // TODO(petersont): remove this allocation once Firefox supports
+ // passing null as argument to this form of texImage2D.
+ var t = new WebGLUnsignedByteArray(width * height * 4);
this.gl.texImage2D(this.gl.TEXTURE_2D, 0, this.gl.RGBA, width, height,
- 0, this.gl.RGBA, this.gl.UNSIGNED_BYTE, null);
+ 0, this.gl.RGBA, this.gl.UNSIGNED_BYTE, t);
}
return texture;
@@ -241,10 +244,13 @@ o3d.Pack.prototype.createTextureCUBE =
texture.texture_target_ = this.gl.TEXTURE_CUBE_MAP;
this.gl.bindTexture(this.gl.TEXTURE_CUBE_MAP, texture.texture_);
+ // TODO(petersont): remove this allocation once Firefox supports
+ // passing null as argument to this form of texImage2D.
+ var t = new WebGLUnsignedByteArray(edgeLength * edgeLength * 4);
for (var ii = 0; ii < 6; ++ii) {
this.gl.texImage2D(this.gl.TEXTURE_CUBE_MAP_POSITIVE_X + ii,
0, this.gl.RGBA, edgeLength, edgeLength, 0,
- this.gl.RGBA, this.gl.UNSIGNED_BYTE, null);
+ this.gl.RGBA, this.gl.UNSIGNED_BYTE, t);
}
this.gl.texParameteri(this.gl.TEXTURE_CUBE_MAP,
this.gl.TEXTURE_MAG_FILTER, this.gl.LINEAR);
diff --git a/o3d/samples/o3d-webgl/render_surface_set.js b/o3d/samples/o3d-webgl/render_surface_set.js
index 9484e9c..694e290 100644
--- a/o3d/samples/o3d-webgl/render_surface_set.js
+++ b/o3d/samples/o3d-webgl/render_surface_set.js
@@ -39,7 +39,7 @@
* 1) If both a color and depth surface is bound, then they must be of
* matching dimensions.
* 2) At least one of render_surface and render_depth_surface must non-null.
- *
+ *
* @param {o3d.RenderSurface} opt_renderSurface The render surface to set.
* @param {o3d.RenderDepthStencilSurface} opt_renderDepthStencilSurface The
* depth stencil render surface to set.
@@ -86,15 +86,15 @@ o3d.RenderSurfaceSet.prototype.clearFramebufferObjects_ =
this.gl.FRAMEBUFFER,
this.gl.COLOR_ATTACHMENT0,
this.gl.RENDERBUFFER,
- 0);
+ null);
this.gl.framebufferRenderbuffer(
this.gl.FRAMEBUFFER,
this.gl.DEPTH_ATTACHMENT,
this.gl.RENDERBUFFER,
- 0);
+ null);
- this.gl.bindFramebuffer(this.gl.FRAMEBUFFER, 0);
+ this.gl.bindFramebuffer(this.gl.FRAMEBUFFER, null);
};
diff --git a/o3d/samples/o3d-webgl/texture.js b/o3d/samples/o3d-webgl/texture.js
index 7cc7927..1e63744 100644
--- a/o3d/samples/o3d-webgl/texture.js
+++ b/o3d/samples/o3d-webgl/texture.js
@@ -367,7 +367,10 @@ o3d.Texture2D.prototype.drawImage =
0, 0, source_img.canvas_.width, source_img.canvas_.height);
this.gl.bindTexture(this.gl.TEXTURE_2D, this.texture_);
- this.gl.texSubImage2D(this.gl.TEXTURE_2D, 0, 0, 0, canvas);
+ // TODO(petersont): replace this with a call to texSubImage2D once
+ // Firefox supports it.
+ this.gl.texImage2D(this.gl.TEXTURE_2D, 0, canvas);
+ // this.gl.texSubImage2D(this.gl.TEXTURE_2D, 0, 0, 0, canvas);
};
generated by cgit v1.1 at 2025-01-18 19:39:33 +0000