Mirrors/overte-lubosz
3
0
Fork 0
mirror of https://github.com/lubosz/overte.git synced 2025-04-09 07:22:31 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

walk.js version 1.25

Browse source
This commit is contained in:
DaveDubUK 2015-06-22 14:18:07 +07:00
parent 13c5c830d7
commit 54608b9cb3
6 changed files with 1383 additions and 1677 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

84
examples/html/walkSettings.html Normal file
View file

@ -0,0 +1,84 @@
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<script>
function emitUpdate() {
EventBridge.emitWebEvent(JSON.stringify({
type: "update",
armsFree: elArmsFree.checked,
footstepSounds: elFootstepSounds.checked,
blenderPreRotations: elBlenderPreRotations.checked
}));
}
function loaded() {
// assign form elements to vars
elPower = document.getElementById("power");
elArmsFree = document.getElementById("arms-free");
elFootstepSounds = document.getElementById("footstep-sounds");
elBlenderPreRotations = document.getElementById("bender-pre-rotations");
if (window.EventBridge !== undefined) {
EventBridge.scriptEventReceived.connect(function(data) {
data = JSON.parse(data);
if (data.type == "update") {
if (data.armsFree !== undefined) {
elArmsFree.checked = data.armsFree == true;
}
if (data.footstepSounds !== undefined) {
elFootstepSounds.checked = data.footstepSounds == true;
}
if (data.blenderPreRotations !== undefined) {
elBlenderPreRotations.checked = data.blenderPreRotations == true;
}
}
});
}
elArmsFree.addEventListener("change", emitUpdate);
elFootstepSounds.addEventListener("change", emitUpdate);
elBlenderPreRotations.addEventListener("change", emitUpdate);
elPower.addEventListener("click", function() {
EventBridge.emitWebEvent(JSON.stringify({
type: "powerToggle"
}));
});
// request initial values
EventBridge.emitWebEvent(JSON.stringify({ type: 'init' }));
}
</script>
</head>
<body onload='loaded();'>
<div class="grid-section">
<div id="entity-list-header">
<input type="button" id="power" value="Power" style="margin-left:68px; margin-top:10px"></button>
</div>
<div class="property-section">
<label>Arms free</label>
<span>
<input type='checkbox' id="arms-free">
</span>
</div>
<div class="property-section">
<label>Footstep sounds</label>
<span>
<input type='checkbox' id="footstep-sounds">
</span>
</div>
<div class="property-section">
<label>Blender pre-rotations</label>
<span>
<input type='checkbox' id="bender-pre-rotations">
</span>
</div>
</div>
</body>
</html>

1190
examples/libraries/walkApi.js
View file

File diff suppressed because it is too large Load diff

148
examples/libraries/walkFilters.js
View file

@ -1,134 +1,78 @@
//
// walkFilters.js
// version 1.1
//
// version 1.002
// Created by David Wooldridge, June 2015
// Copyright © 2014 - 2015 High Fidelity, Inc.
//
// Created by David Wooldridge, Autumn 2014
//
// Provides a variety of filters for use by the walk.js script v1.12
// Provides a variety of filters for use by the walk.js script v1.2+
//
// Distributed under the Apache License, Version 2.0.
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
//
// simple averaging (LP) filter for damping / smoothing
AveragingFilter = function(length) {
//this.name = name;
// initialise the array of past values
this.pastValues = [];
for(var i = 0; i < length; i++) {
for (var i = 0; i < length; i++) {
this.pastValues.push(0);
}
// single arg is the nextInputValue
this.process = function() {
if (this.pastValues.length === 0 && arguments[0]) {
return arguments[0];
} else if (arguments[0] !== null) {
// apply quick and simple LP filtering
this.pastValues.push(arguments[0]);
this.pastValues.shift();
var nextOutputValue = 0;
for (var ea in this.pastValues) nextOutputValue += this.pastValues[ea];
for (var value in this.pastValues) nextOutputValue += this.pastValues[value];
return nextOutputValue / this.pastValues.length;
} else {
return 0;
}
};
};
// 1st order Butterworth filter - calculate coeffs here: http://www-users.cs.york.ac.uk/~fisher/mkfilter/trad.html
// provides LP filtering with a more stable frequency / phase response (-3 dB @ 3 Hz)
ButterworthFilter1 = function() {
this.gain = 7.313751515;
this.coeff = 0.7265425280;
// 2nd order 2Hz Butterworth LP filter
ButterworthFilter = function() {
// coefficients calculated at: http://www-users.cs.york.ac.uk/~fisher/mkfilter/trad.html
this.gain = 104.9784742;
this.coeffOne = -0.7436551950;
this.coeffTwo = 1.7055521455;
// initialise the arrays
this.xv = [];
this.yv = [];
for(var i = 0; i < 2; i++) {
for (var i = 0; i < 3; i++) {
this.xv.push(0);
this.yv.push(0);
}
// process values
this.process = function(nextInputValue) {
this.xv[0] = this.xv[1];
this.xv[1] = nextInputValue / this.gain;
this.yv[0] = this.yv[1];
this.yv[1] = this.xv[0] + this.xv[1] + this.coeff * this.yv[0];
return this.yv[1];
};
}; // end Butterworth filter constructor
// 2nd order Butterworth LP filter - calculate coeffs here: http://www-users.cs.york.ac.uk/~fisher/mkfilter/trad.html
// provides LP filtering with a more stable frequency / phase response
ButterworthFilter2 = function(cutOff) {
switch(cutOff) {
case 5:
default:
this.gain = 20.20612010;
this.coeffOne = -0.4775922501;
this.coeffTwo = 1.2796324250;
break;
}
// initialise the arrays
this.xv = [];
this.yv = [];
for(var i = 0; i < 3; i++) {
this.xv.push(0);
this.yv.push(0);
}
// process values
this.process = function(nextInputValue) {
this.xv[0] = this.xv[1];
this.xv[1] = this.xv[2];
this.xv[2] = nextInputValue / this.gain;
this.yv[0] = this.yv[1];
this.yv[1] = this.yv[2];
this.yv[2] = (this.xv[0] + this.xv[2]) +
2 * this.xv[1] +
(this.coeffOne * this.yv[0]) +
(this.coeffTwo * this.yv[1]);
return this.yv[2];
};
}; // end Butterworth filter constructor
// Add harmonics to a given sine wave to form square, sawtooth or triangle waves
// Geometric wave synthesis fundamentals taken from: http://hyperphysics.phy-astr.gsu.edu/hbase/audio/geowv.html
WaveSynth = function(waveShape, numHarmonics, smoothing) {
this.numHarmonics = numHarmonics;
this.waveShape = waveShape;
this.smoothingFilter = new AveragingFilter(smoothing);
// NB: frequency in radians
this.calculate = function(frequency) {
// make some shapes
var harmonics = 0;
var multiplier = 0;
@ -136,20 +80,15 @@ WaveSynth = function(waveShape, numHarmonics, smoothing) {
if (this.waveShape === TRIANGLE) {
iterations++;
}
for(var n = 1; n < iterations; n++) {
switch(this.waveShape) {
for (var n = 1; n < iterations; n++) {
switch (this.waveShape) {
case SAWTOOTH: {
multiplier = 1 / n;
harmonics += multiplier * Math.sin(n * frequency);
break;
}
case TRIANGLE: {
if (n % 2 === 1) {
var mulitplier = 1 / (n * n);
// multiply (4n-1)th harmonics by -1
@ -162,7 +101,6 @@ WaveSynth = function(waveShape, numHarmonics, smoothing) {
}
case SQUARE: {
if (n % 2 === 1) {
multiplier = 1 / n;
harmonics += multiplier * Math.sin(n * frequency);
@ -171,33 +109,31 @@ WaveSynth = function(waveShape, numHarmonics, smoothing) {
}
}
}
// smooth the result and return
return this.smoothingFilter.process(harmonics);
};
};
// Create a motion wave by summing pre-calcualted sinusoidal harmonics
// Create a motion wave by summing pre-calculated harmonics (Fourier synthesis)
HarmonicsFilter = function(magnitudes, phaseAngles) {
this.magnitudes = magnitudes;
this.phaseAngles = phaseAngles;
this.calculate = function(twoPiFT) {
var harmonics = 0;
var numHarmonics = magnitudes.length;
for(var n = 0; n < numHarmonics; n++) {
for (var n = 0; n < numHarmonics; n++) {
harmonics += this.magnitudes[n] * Math.cos(n * twoPiFT - this.phaseAngles[n]);
}
return harmonics;
};
};
// the main filter object
// the main filter object literal
filter = (function() {
// Bezier private variables
var _C1 = {x:0, y:0};
var _C4 = {x:1, y:1};
// Bezier private functions
function _B1(t) { return t * t * t };
@ -209,63 +145,52 @@ filter = (function() {
// helper methods
degToRad: function(degrees) {
var convertedValue = degrees * Math.PI / 180;
return convertedValue;
},
radToDeg: function(radians) {
var convertedValue = radians * 180 / Math.PI;
return convertedValue;
},
// these filters need instantiating, as they hold arrays of previous values
// simple averaging (LP) filter for damping / smoothing
createAveragingFilter: function(length) {
var newAveragingFilter = new AveragingFilter(length);
return newAveragingFilter;
},
createButterworthFilter1: function() {
var newButterworthFilter = new ButterworthFilter1();
return newButterworthFilter;
},
createButterworthFilter2: function(cutoff) {
var newButterworthFilter = new ButterworthFilter2(cutoff);
// provides LP filtering with improved frequency / phase response
createButterworthFilter: function() {
var newButterworthFilter = new ButterworthFilter();
return newButterworthFilter;
},
// generates sawtooth, triangle or square waves using harmonics
createWaveSynth: function(waveShape, numHarmonics, smoothing) {
var newWaveSynth = new WaveSynth(waveShape, numHarmonics, smoothing);
return newWaveSynth;
},
// generates arbitrary waveforms using pre-calculated harmonics
createHarmonicsFilter: function(magnitudes, phaseAngles) {
var newHarmonicsFilter = new HarmonicsFilter(magnitudes, phaseAngles);
return newHarmonicsFilter;
},
// the following filters do not need separate instances, as they hold no previous values
bezier: function(percent, C1, C2, C3, C4) {
// Bezier functions for more natural transitions
// Bezier response curve shaping for more natural transitions
bezier: function(input, C2, C3) {
// based on script by Dan Pupius (www.pupius.net) http://13thparallel.com/archive/bezier-curves/
var pos = {x: 0, y: 0};
pos.x = C1.x * _B1(percent) + C2.x * _B2(percent) + C3.x * _B3(percent) + C4.x * _B4(percent);
pos.y = C1.y * _B1(percent) + C2.y * _B2(percent) + C3.y * _B3(percent) + C4.y * _B4(percent);
return pos;
input = 1 - input;
return _C1.y * _B1(input) + C2.y * _B2(input) + C3.y * _B3(input) + _C4.y * _B4(input);
},
// simple clipping filter (clips bottom of wave only)
// simple clipping filter (special case for hips y-axis skeleton offset for walk animation)
clipTrough: function(inputValue, peak, strength) {
var outputValue = inputValue * strength;
if (outputValue < -peak) {
outputValue = -peak;
@ -273,5 +198,4 @@ filter = (function() {
return outputValue;
}
}
})();

340
examples/libraries/walkInterface.js
View file

@ -1,340 +0,0 @@
//
// walkInterface.js
//
// version 2.0
//
// Created by David Wooldridge, Autumn 2014
//
// Presents the UI for the walk.js script v1.12
//
// Distributed under the Apache License, Version 2.0.
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
//
walkInterface = (function() {
// references to walk.js objects
var _motion = null;
var _walkAssets = null;
// controller UI element positions and dimensions
var _backgroundWidth = 350;
var _backgroundHeight = 700;
var _backgroundX = Window.innerWidth - _backgroundWidth - 58;
var _backgroundY = Window.innerHeight / 2 - _backgroundHeight / 2;
var _bigButtonsY = 348;
// Load up the overlays
var _buttonOverlays = [];
// ui minimised tab
var _controlsMinimisedTab = Overlays.addOverlay("image", {
x: Window.innerWidth - 58,
y: Window.innerHeight - 145,
width: 50, height: 50,
imageURL: pathToAssets + 'overlay-images/minimised-tab.png',
visible: true, alpha: 0.9
});
// ui background
var _controlsBackground = Overlays.addOverlay("image", {
bounds: {
x: _backgroundX,
y: _backgroundY,
width: _backgroundWidth,
height: _backgroundHeight
},
imageURL: pathToAssets + "overlay-images/background.png",
alpha: 1, visible: false
});
// button overlays
var _controlsMinimiseButton = Overlays.addOverlay("image", {
bounds: {
x: _backgroundX + _backgroundWidth - 62,
y: _backgroundY + 40,
width: 25, height: 25
},
imageURL: pathToAssets + "overlay-images/minimise-button.png",
alpha: 1, visible: false
});
_buttonOverlays.push(_controlsMinimiseButton);
var _onButton = Overlays.addOverlay("image", {
bounds: {
x: _backgroundX + _backgroundWidth / 2 - 115,
y: _backgroundY + _bigButtonsY,
width: 230, height: 36
},
imageURL: pathToAssets + "overlay-images/power-button-selected.png",
alpha: 1, visible: false
});
_buttonOverlays.push(_onButton);
var _offButton = Overlays.addOverlay("image", {
bounds: {
x: _backgroundX + _backgroundWidth / 2 - 115,
y: _backgroundY + _bigButtonsY,
width: 230, height: 36
},
imageURL: pathToAssets + "overlay-images/power-button.png",
alpha: 1, visible: false
});
_buttonOverlays.push(_offButton);
var _femaleButton = Overlays.addOverlay("image", {
bounds: {
x: _backgroundX + _backgroundWidth / 2 - 115,
y: _backgroundY + _bigButtonsY + 60,
width: 230, height: 36
},
imageURL: pathToAssets + "overlay-images/female-button.png",
alpha: 1, visible: false
});
_buttonOverlays.push(_femaleButton);
var _femaleButtonSelected = Overlays.addOverlay("image", {
bounds: {
x: _backgroundX + _backgroundWidth / 2 - 115,
y: _backgroundY + _bigButtonsY + 60,
width: 230, height: 36
},
imageURL: pathToAssets + "overlay-images/female-button-selected.png",
alpha: 1, visible: false
});
_buttonOverlays.push(_femaleButtonSelected);
var _maleButton = Overlays.addOverlay("image", {
bounds: {
x: _backgroundX + _backgroundWidth / 2 - 115,
y: _backgroundY + _bigButtonsY + 120,
width: 230, height: 36
},
imageURL: pathToAssets + "overlay-images/male-button.png",
alpha: 1, visible: false
});
_buttonOverlays.push(_maleButton);
var _maleButtonSelected = Overlays.addOverlay("image", {
bounds: {
x: _backgroundX + _backgroundWidth / 2 - 115,
y: _backgroundY + _bigButtonsY + 120,
width: 230, height: 36
},
imageURL: pathToAssets + "overlay-images/male-button-selected.png",
alpha: 1, visible: false
});
_buttonOverlays.push(_maleButtonSelected);
var _armsFreeButton = Overlays.addOverlay("image", {
bounds: {
x: _backgroundX + _backgroundWidth / 2 - 115,
y: _backgroundY + _bigButtonsY + 180,
width: 230, height: 36
},
imageURL: pathToAssets + "overlay-images/arms-free-button.png",
alpha: 1, visible: false
});
_buttonOverlays.push(_armsFreeButton);
var _armsFreeButtonSelected = Overlays.addOverlay("image", {
bounds: {
x: _backgroundX + _backgroundWidth / 2 - 115,
y: _backgroundY + _bigButtonsY + 180,
width: 230, height: 36
},
imageURL: pathToAssets + "overlay-images/arms-free-button-selected.png",
alpha: 1, visible: false
});
_buttonOverlays.push(_armsFreeButtonSelected);
var _footstepsButton = Overlays.addOverlay("image", {
bounds: {
x: _backgroundX + _backgroundWidth / 2 - 115,
y: _backgroundY + _bigButtonsY + 240,
width: 230, height: 36
},
imageURL: pathToAssets + "overlay-images/footstep-sounds-button.png",
alpha: 1, visible: false
});
_buttonOverlays.push(_footstepsButton);
var _footstepsButtonSelected = Overlays.addOverlay("image", {
bounds: {
x: _backgroundX + _backgroundWidth / 2 - 115,
y: _backgroundY + _bigButtonsY + 240,
width: 230, height: 36
},
imageURL: pathToAssets + "overlay-images/footstep-sounds-button-selected.png",
alpha: 1, visible: false
});
_buttonOverlays.push(_footstepsButtonSelected);
function minimiseDialog(minimise) {
Overlays.editOverlay(_controlsBackground, {visible: !minimise});
Overlays.editOverlay(_controlsMinimisedTab, {visible: minimise});
Overlays.editOverlay(_controlsMinimiseButton, {visible: !minimise});
if(_state.powerOn) {
Overlays.editOverlay(_onButton, {visible: !minimise});
Overlays.editOverlay(_offButton, {visible: false});
} else {
Overlays.editOverlay(_onButton, {visible: false});
Overlays.editOverlay(_offButton, {visible: !minimise});
}
if (_motion.avatarGender === FEMALE) {
Overlays.editOverlay(_femaleButtonSelected, {visible: !minimise});
Overlays.editOverlay(_femaleButton, {visible: false});
Overlays.editOverlay(_maleButtonSelected, {visible: false});
Overlays.editOverlay(_maleButton, {visible: !minimise});
} else {
Overlays.editOverlay(_femaleButtonSelected, {visible: false});
Overlays.editOverlay(_femaleButton, {visible: !minimise});
Overlays.editOverlay(_maleButtonSelected, {visible: !minimise});
Overlays.editOverlay(_maleButton, {visible: false});
}
if (_motion.armsFree) {
Overlays.editOverlay(_armsFreeButtonSelected, {visible: !minimise});
Overlays.editOverlay(_armsFreeButton, {visible: false});
} else {
Overlays.editOverlay(_armsFreeButtonSelected, {visible: false});
Overlays.editOverlay(_armsFreeButton, {visible: !minimise});
}
if (_motion.makesFootStepSounds) {
Overlays.editOverlay(_footstepsButtonSelected, {visible: !minimise});
Overlays.editOverlay(_footstepsButton, {visible: false});
} else {
Overlays.editOverlay(_footstepsButtonSelected, {visible: false});
Overlays.editOverlay(_footstepsButton, {visible: !minimise});
}
};
// mouse event handler
function mousePressEvent(event) {
var clickedOverlay = Overlays.getOverlayAtPoint({x: event.x, y: event.y});
switch (clickedOverlay) {
case _controlsMinimiseButton:
minimiseDialog(true);
_state.setInternalState(_state.STANDING);
return;
case _controlsMinimisedTab:
minimiseDialog(false);
_state.setInternalState(_state.STANDING);
return;
case _onButton:
_state.powerOn = false;
Overlays.editOverlay(_offButton, {visible: true});
Overlays.editOverlay(_onButton, {visible: false});
_state.setInternalState(state.STANDING);
return;
case _offButton:
_state.powerOn = true;
Overlays.editOverlay(_offButton, {visible: false});
Overlays.editOverlay(_onButton, {visible: true});
_state.setInternalState(state.STANDING);
return;
case _footstepsButton:
_motion.makesFootStepSounds = true;
Overlays.editOverlay(_footstepsButtonSelected, {visible: true});
Overlays.editOverlay(_footstepsButton, {visible: false});
return;
case _footstepsButtonSelected:
_motion.makesFootStepSounds = false;
Overlays.editOverlay(_footstepsButton, {visible: true});
Overlays.editOverlay(_footstepsButtonSelected, {visible: false});
return;
case _femaleButton:
case _maleButtonSelected:
_motion.setGender(FEMALE);
Overlays.editOverlay(_femaleButtonSelected, {visible: true});
Overlays.editOverlay(_femaleButton, {visible: false});
Overlays.editOverlay(_maleButton, {visible: true});
Overlays.editOverlay(_maleButtonSelected, {visible: false});
return;
case _maleButton:
case _femaleButtonSelected:
_motion.setGender(MALE);
Overlays.editOverlay(_femaleButton, {visible: true});
Overlays.editOverlay(_femaleButtonSelected, {visible: false});
Overlays.editOverlay(_maleButtonSelected, {visible: true});
Overlays.editOverlay(_maleButton, {visible: false});
return;
case _armsFreeButton:
_motion.armsFree = true;
Overlays.editOverlay(_armsFreeButtonSelected, {visible: true});
Overlays.editOverlay(_armsFreeButton, {visible: false});
return;
case _armsFreeButtonSelected:
_motion.armsFree = false;
_motion.poseFingers();
Overlays.editOverlay(_armsFreeButtonSelected, {visible: false});
Overlays.editOverlay(_armsFreeButton, {visible: true});
return;
}
};
Controller.mousePressEvent.connect(mousePressEvent);
// delete overlays on script ending
Script.scriptEnding.connect(function() {
// delete overlays
Overlays.deleteOverlay(_controlsBackground);
Overlays.deleteOverlay(_controlsMinimisedTab);
for (var i in _buttonOverlays) {
Overlays.deleteOverlay(_buttonOverlays[i]);
}
});
// public method
return {
// gather references to objects from the walk.js script
initialise: function(state, motion, walkAssets) {
_state = state;
_motion = motion;
_walkAssets = walkAssets;
}
}; // end public methods (return)
})();

74
examples/libraries/walkSettings.js Normal file
View file

@ -0,0 +1,74 @@
//
// walkSettings.js
// version 1.0
//
// Created by David Wooldridge, June 2015
// Copyright © 2015 High Fidelity, Inc.
//
// Presents settings for walk.js
//
// Editing tools for animation data files available here: https://github.com/DaveDubUK/walkTools
//
// Distributed under the Apache License, Version 2.0.
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
//
WalkSettings = function() {
var that = {};
// ui minimised tab
var _innerWidth = Window.innerWidth;
var visible = false;
var _minimisedTab = Overlays.addOverlay("image", {
x: _innerWidth - 58, y: Window.innerHeight - 145,
width: 50, height: 50,
imageURL: pathToAssets + 'overlay-images/ddpa-minimised-ddpa-tab.png',
visible: true, alpha: 0.9
});
function mousePressEvent(event) {
if (Overlays.getOverlayAtPoint(event) === _minimisedTab) {
visible = !visible;
webView.setVisible(visible);
}
}
Controller.mousePressEvent.connect(mousePressEvent);
function cleanup() {
Overlays.deleteOverlay(_minimisedTab);
}
Script.update.connect(function() {
if (_innerWidth !== Window.innerWidth) {
_innerWidth = Window.innerWidth;
Overlays.editOverlay(_minimisedTab, {x: _innerWidth - 58});
}
});
Script.scriptEnding.connect(cleanup);
// web window
var url = Script.resolvePath('html/walkSettings.html');
var webView = new WebWindow('Walk Settings', url, 200, 180, false);
webView.setVisible(false);
webView.eventBridge.webEventReceived.connect(function(data) {
data = JSON.parse(data);
if (data.type == "init") {
// send the current settings to the dialog
webView.eventBridge.emitScriptEvent(JSON.stringify({
type: "update",
armsFree: avatar.armsFree,
footstepSounds: avatar.makesFootStepSounds,
blenderPreRotations: avatar.isBlenderExport
}));
} else if (data.type == "powerToggle") {
motion.isLive = !motion.isLive;
} else if (data.type == "update") {
// receive settings from the dialog
avatar.armsFree = data.armsFree;
avatar.makesFootStepSounds = data.footstepSounds;
avatar.isBlenderExport = data.blenderPreRotations;
}
});
return that;
};

1224
examples/walk.js
View file

File diff suppressed because it is too large Load diff