| OLD | NEW |
|---|
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <!-- | 2 <!-- |
| 3 Copyright (c) 2014 The Chromium Authors. All rights reserved. | 3 Copyright (c) 2014 The Chromium Authors. All rights reserved. |
| 4 Use of this source code is governed by a BSD-style license that can be | 4 Use of this source code is governed by a BSD-style license that can be |
| 5 found in the LICENSE file. | 5 found in the LICENSE file. |
| 6 --> | 6 --> |
| 7 | 7 |
| 8 <link rel="import" href="/tracing/base/settings.html"> | 8 <link rel="import" href="/tracing/base/settings.html"> |
| 9 <link rel="import" href="/tracing/ui/base/ui.html"> | 9 <link rel="import" href="/tracing/ui/base/ui.html"> |
| 10 <link rel="import" href="/tracing/ui/base/utils.html"> | 10 <link rel="import" href="/tracing/ui/base/utils.html"> |
| 11 | 11 |
| 12 <script> | 12 <script> |
| 13 'use strict'; | 13 'use strict'; |
| 14 | 14 |
| 15 tr.exportTo('tr.ui.b', function() { | 15 tr.exportTo('tr.ui.b', function() { |
| 16 let deg2rad = tr.b.math.deg2rad; |
| 17 |
| 16 var constants = { | 18 var constants = { |
| 17 DEFAULT_SCALE: 0.5, | 19 DEFAULT_SCALE: 0.5, |
| 18 DEFAULT_EYE_DISTANCE: 10000, | 20 DEFAULT_EYE_DISTANCE: 10000, |
| 19 MINIMUM_DISTANCE: 1000, | 21 MINIMUM_DISTANCE: 1000, |
| 20 MAXIMUM_DISTANCE: 100000, | 22 MAXIMUM_DISTANCE: 100000, |
| 21 FOV: 15, | 23 FOV: 15, |
| 22 RESCALE_TIMEOUT_MS: 200, | 24 RESCALE_TIMEOUT_MS: 200, |
| 23 MAXIMUM_TILT: 80, | 25 MAXIMUM_TILT: 80, |
| 24 SETTINGS_NAMESPACE: 'tr.ui_camera' | 26 SETTINGS_NAMESPACE: 'tr.ui_camera' |
| 25 }; | 27 }; |
| 26 | 28 |
| 27 | |
| 28 var Camera = tr.ui.b.define('camera'); | 29 var Camera = tr.ui.b.define('camera'); |
| 29 | 30 |
| 30 Camera.prototype = { | 31 Camera.prototype = { |
| 31 __proto__: HTMLUnknownElement.prototype, | 32 __proto__: HTMLUnknownElement.prototype, |
| 32 | 33 |
| 33 decorate: function(eventSource) { | 34 decorate: function(eventSource) { |
| 34 this.eventSource_ = eventSource; | 35 this.eventSource_ = eventSource; |
| 35 | 36 |
| 36 this.eventSource_.addEventListener('beginpan', | 37 this.eventSource_.addEventListener('beginpan', |
| 37 this.onPanBegin_.bind(this)); | 38 this.onPanBegin_.bind(this)); |
| (...skipping 32 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 70 }, | 71 }, |
| 71 | 72 |
| 72 get projectionMatrix() { | 73 get projectionMatrix() { |
| 73 var rect = | 74 var rect = |
| 74 tr.ui.b.windowRectForElement(this.canvas_). | 75 tr.ui.b.windowRectForElement(this.canvas_). |
| 75 scaleSize(this.pixelRatio_); | 76 scaleSize(this.pixelRatio_); |
| 76 | 77 |
| 77 var aspectRatio = rect.width / rect.height; | 78 var aspectRatio = rect.width / rect.height; |
| 78 var matrix = mat4.create(); | 79 var matrix = mat4.create(); |
| 79 mat4.perspective( | 80 mat4.perspective( |
| 80 matrix, tr.b.deg2rad(constants.FOV), aspectRatio, 1, 100000); | 81 matrix, deg2rad(constants.FOV), aspectRatio, 1, 100000); |
| 81 | 82 |
| 82 return matrix; | 83 return matrix; |
| 83 }, | 84 }, |
| 84 | 85 |
| 85 set canvas(c) { | 86 set canvas(c) { |
| 86 this.canvas_ = c; | 87 this.canvas_ = c; |
| 87 }, | 88 }, |
| 88 | 89 |
| 89 set deviceRect(rect) { | 90 set deviceRect(rect) { |
| 90 this.deviceRect_ = rect; | 91 this.deviceRect_ = rect; |
| (...skipping 63 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 154 // Get the eye vector, since we'll be adjusting gazeTarget. | 155 // Get the eye vector, since we'll be adjusting gazeTarget. |
| 155 var eyeVector = [ | 156 var eyeVector = [ |
| 156 this.eye_[0] - this.gazeTarget_[0], | 157 this.eye_[0] - this.gazeTarget_[0], |
| 157 this.eye_[1] - this.gazeTarget_[1], | 158 this.eye_[1] - this.gazeTarget_[1], |
| 158 this.eye_[2] - this.gazeTarget_[2]]; | 159 this.eye_[2] - this.gazeTarget_[2]]; |
| 159 var length = vec3.length(eyeVector); | 160 var length = vec3.length(eyeVector); |
| 160 vec3.normalize(eyeVector, eyeVector); | 161 vec3.normalize(eyeVector, eyeVector); |
| 161 | 162 |
| 162 var halfFov = constants.FOV / 2; | 163 var halfFov = constants.FOV / 2; |
| 163 var multiplier = | 164 var multiplier = |
| 164 2.0 * length * Math.tan(tr.b.deg2rad(halfFov)) / rect.height; | 165 2.0 * length * Math.tan(deg2rad(halfFov)) / rect.height; |
| 165 | 166 |
| 166 // Get the up and right vectors. | 167 // Get the up and right vectors. |
| 167 var up = [0, 1, 0]; | 168 var up = [0, 1, 0]; |
| 168 var rotMatrix = mat4.create(); | 169 var rotMatrix = mat4.create(); |
| 169 mat4.rotate( | 170 mat4.rotate( |
| 170 rotMatrix, rotMatrix, tr.b.deg2rad(this.rotation_[1]), [0, 1, 0]); | 171 rotMatrix, rotMatrix, deg2rad(this.rotation_[1]), [0, 1, 0]); |
| 171 mat4.rotate( | 172 mat4.rotate( |
| 172 rotMatrix, rotMatrix, tr.b.deg2rad(this.rotation_[0]), [1, 0, 0]); | 173 rotMatrix, rotMatrix, deg2rad(this.rotation_[0]), [1, 0, 0]); |
| 173 vec3.transformMat4(up, up, rotMatrix); | 174 vec3.transformMat4(up, up, rotMatrix); |
| 174 | 175 |
| 175 var right = [0, 0, 0]; | 176 var right = [0, 0, 0]; |
| 176 vec3.cross(right, eyeVector, up); | 177 vec3.cross(right, eyeVector, up); |
| 177 vec3.normalize(right, right); | 178 vec3.normalize(right, right); |
| 178 | 179 |
| 179 // Update the gaze target. | 180 // Update the gaze target. |
| 180 for (var i = 0; i < 3; ++i) { | 181 for (var i = 0; i < 3; ++i) { |
| 181 this.gazeTarget_[i] += | 182 this.gazeTarget_[i] += |
| 182 delta[0] * multiplier * right[i] - delta[1] * multiplier * up[i]; | 183 delta[0] * multiplier * right[i] - delta[1] * multiplier * up[i]; |
| 183 | 184 |
| 184 this.eye_[i] = this.gazeTarget_[i] + length * eyeVector[i]; | 185 this.eye_[i] = this.gazeTarget_[i] + length * eyeVector[i]; |
| 185 } | 186 } |
| 186 | 187 |
| 187 // If we have some z offset, we need to reposition gazeTarget | 188 // If we have some z offset, we need to reposition gazeTarget |
| 188 // to be on the plane z = 0 with normal [0, 0, 1]. | 189 // to be on the plane z = 0 with normal [0, 0, 1]. |
| 189 if (Math.abs(this.gazeTarget_[2]) > 1e-6) { | 190 if (Math.abs(this.gazeTarget_[2]) > 1e-6) { |
| 190 var gazeVector = [-eyeVector[0], -eyeVector[1], -eyeVector[2]]; | 191 var gazeVector = [-eyeVector[0], -eyeVector[1], -eyeVector[2]]; |
| 191 var newLength = tr.b.clamp( | 192 var newLength = tr.b.math.clamp( |
| 192 -this.eye_[2] / gazeVector[2], | 193 -this.eye_[2] / gazeVector[2], |
| 193 constants.MINIMUM_DISTANCE, | 194 constants.MINIMUM_DISTANCE, |
| 194 constants.MAXIMUM_DISTANCE); | 195 constants.MAXIMUM_DISTANCE); |
| 195 | 196 |
| 196 for (var i = 0; i < 3; ++i) | 197 for (var i = 0; i < 3; ++i) |
| 197 this.gazeTarget_[i] = this.eye_[i] + newLength * gazeVector[i]; | 198 this.gazeTarget_[i] = this.eye_[i] + newLength * gazeVector[i]; |
| 198 } | 199 } |
| 199 | 200 |
| 200 this.saveCameraToSettings(tr.b.SessionSettings()); | 201 this.saveCameraToSettings(tr.b.SessionSettings()); |
| 201 this.dispatchRenderEvent_(); | 202 this.dispatchRenderEvent_(); |
| 202 }, | 203 }, |
| 203 | 204 |
| 204 updateZoomByDelta: function(delta) { | 205 updateZoomByDelta: function(delta) { |
| 205 var deltaY = delta[1]; | 206 var deltaY = delta[1]; |
| 206 deltaY = tr.b.clamp(deltaY, -50, 50); | 207 deltaY = tr.b.math.clamp(deltaY, -50, 50); |
| 207 var scale = 1.0 - deltaY / 100.0; | 208 var scale = 1.0 - deltaY / 100.0; |
| 208 | 209 |
| 209 var eyeVector = [0, 0, 0]; | 210 var eyeVector = [0, 0, 0]; |
| 210 vec3.subtract(eyeVector, this.eye_, this.gazeTarget_); | 211 vec3.subtract(eyeVector, this.eye_, this.gazeTarget_); |
| 211 | 212 |
| 212 var length = vec3.length(eyeVector); | 213 var length = vec3.length(eyeVector); |
| 213 | 214 |
| 214 // Clamp the length to allowed values by changing the scale. | 215 // Clamp the length to allowed values by changing the scale. |
| 215 if (length * scale < constants.MINIMUM_DISTANCE) | 216 if (length * scale < constants.MINIMUM_DISTANCE) |
| 216 scale = constants.MINIMUM_DISTANCE / length; | 217 scale = constants.MINIMUM_DISTANCE / length; |
| (...skipping 15 matching lines...) Expand all Loading... |
| 232 return; | 233 return; |
| 233 if (Math.abs(this.rotation_[1] - delta[0]) > constants.MAXIMUM_TILT) | 234 if (Math.abs(this.rotation_[1] - delta[0]) > constants.MAXIMUM_TILT) |
| 234 return; | 235 return; |
| 235 | 236 |
| 236 var eyeVector = [0, 0, 0, 0]; | 237 var eyeVector = [0, 0, 0, 0]; |
| 237 vec3.subtract(eyeVector, this.eye_, this.gazeTarget_); | 238 vec3.subtract(eyeVector, this.eye_, this.gazeTarget_); |
| 238 | 239 |
| 239 // Undo the current rotation. | 240 // Undo the current rotation. |
| 240 var rotMatrix = mat4.create(); | 241 var rotMatrix = mat4.create(); |
| 241 mat4.rotate( | 242 mat4.rotate( |
| 242 rotMatrix, rotMatrix, -tr.b.deg2rad(this.rotation_[0]), [1, 0, 0]); | 243 rotMatrix, rotMatrix, -deg2rad(this.rotation_[0]), [1, 0, 0]); |
| 243 mat4.rotate( | 244 mat4.rotate( |
| 244 rotMatrix, rotMatrix, -tr.b.deg2rad(this.rotation_[1]), [0, 1, 0]); | 245 rotMatrix, rotMatrix, -deg2rad(this.rotation_[1]), [0, 1, 0]); |
| 245 vec4.transformMat4(eyeVector, eyeVector, rotMatrix); | 246 vec4.transformMat4(eyeVector, eyeVector, rotMatrix); |
| 246 | 247 |
| 247 // Update rotation values. | 248 // Update rotation values. |
| 248 this.rotation_[0] += delta[1]; | 249 this.rotation_[0] += delta[1]; |
| 249 this.rotation_[1] -= delta[0]; | 250 this.rotation_[1] -= delta[0]; |
| 250 | 251 |
| 251 // Redo the new rotation. | 252 // Redo the new rotation. |
| 252 mat4.identity(rotMatrix); | 253 mat4.identity(rotMatrix); |
| 253 mat4.rotate( | 254 mat4.rotate( |
| 254 rotMatrix, rotMatrix, tr.b.deg2rad(this.rotation_[1]), [0, 1, 0]); | 255 rotMatrix, rotMatrix, deg2rad(this.rotation_[1]), [0, 1, 0]); |
| 255 mat4.rotate( | 256 mat4.rotate( |
| 256 rotMatrix, rotMatrix, tr.b.deg2rad(this.rotation_[0]), [1, 0, 0]); | 257 rotMatrix, rotMatrix, deg2rad(this.rotation_[0]), [1, 0, 0]); |
| 257 vec4.transformMat4(eyeVector, eyeVector, rotMatrix); | 258 vec4.transformMat4(eyeVector, eyeVector, rotMatrix); |
| 258 | 259 |
| 259 vec3.add(this.eye_, this.gazeTarget_, eyeVector); | 260 vec3.add(this.eye_, this.gazeTarget_, eyeVector); |
| 260 | 261 |
| 261 this.saveCameraToSettings(tr.b.SessionSettings()); | 262 this.saveCameraToSettings(tr.b.SessionSettings()); |
| 262 this.dispatchRenderEvent_(); | 263 this.dispatchRenderEvent_(); |
| 263 }, | 264 }, |
| 264 | 265 |
| 265 | 266 |
| 266 // Event callbacks. | 267 // Event callbacks. |
| (...skipping 72 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 339 dispatchRenderEvent_: function() { | 340 dispatchRenderEvent_: function() { |
| 340 tr.b.dispatchSimpleEvent(this, 'renderrequired', false, false); | 341 tr.b.dispatchSimpleEvent(this, 'renderrequired', false, false); |
| 341 } | 342 } |
| 342 }; | 343 }; |
| 343 | 344 |
| 344 return { | 345 return { |
| 345 Camera, | 346 Camera, |
| 346 }; | 347 }; |
| 347 }); | 348 }); |
| 348 </script> | 349 </script> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2771723003:
[tracing] Move math utilities from base into their own subdirectory (attempt 2) (Closed)
