added dynamic frags

This commit is contained in:
Leon van Kammen 2023-10-26 13:19:03 +02:00
parent a68ffe12d0
commit 291b87f94a
8 changed files with 152 additions and 28 deletions

View file

@ -48,8 +48,6 @@
<script>
window.$ = (s) => document.querySelector(s)
window.notify = notify(window)
window.embed = embed
console.log = ( (log) => function(str){
if( String(str).match(/:.*#/) ) window.notify(str)
@ -60,6 +58,9 @@
$('#home').setAttribute('xrf', document.location.search.substr(1)+document.location.hash )
$('a-scene').addEventListener('XRF', () => {
window.notify = notify(window)
window.embed = embed
let XRF = window.AFRAME.XRF
setupConsole( $('textarea') )

File diff suppressed because one or more lines are too long

View file

@ -14,16 +14,26 @@
* xrf.emit('foo',123).then(...).catch(...).finally(...)
*/
xrf.addEventListener = function(eventName, callback) {
xrf.addEventListener = function(eventName, callback, scene) {
if( !this._listeners ) this._listeners = []
if (!this._listeners[eventName]) {
// create a new array for this event name if it doesn't exist yet
this._listeners[eventName] = [];
}
if( scene ) callback.scene = scene
// add the callback to the listeners array for this event name
this._listeners[eventName].push(callback);
};
xrf.removeEventListeners = function( everything ){
if( everything ) this._listeners = []
else{
for( let eventName in this._listener ){
this._listener[eventName] = this._listener[eventName].filter( (e) => e.callback ? null : e )
}
}
}
xrf.emit = function(eventName, data){
if( typeof data != 'object' ) throw 'emit() requires passing objects'
return xrf.emit.promise(eventName,data)

View file

@ -0,0 +1,24 @@
xrf.addEventListener('dynamicKeyValue', (opts) => {
let {scene,match,v} = opts
let light = v.fragment
scene.traverse( (o) => {
if( o.isLight && o.name == light ){
if( v.x != undefined ){
o.color.r = v.x
o.color.g = v.y
o.color.b = v.z
console.dir(o)
}else{
let driver = xrf.scene.getObjectByName(v.string)
if( !driver ) return
o.onAfterRender = () => {
let model = xrf.model
if( !model || !model.clock ) return
o.color.r = v.x
o.color.g = v.y
o.color.b = v.z
}
}
}
})
})

View file

@ -0,0 +1,32 @@
xrf.addEventListener('dynamicKeyValue', (opts) => {
let {scene,match,v} = opts
let material = v.fragment
const setMaterial = (mesh,v) => {
let mat = mesh.material
mat.transparent = v.x < 1.0
mat.opacity = v.x
}
console.dir(v)
scene.traverse( (mesh) => {
if( mesh.material){
if( mesh.material && mesh.material.name == material ){
delete mesh.onBeforeRender
delete mesh.driver
let opacity = v.float || v.x
if( opacity != undefined ){
setMaterial( mesh, {x:opacity})
}else{
mesh.driver = xrf.scene.getObjectByName(v.string)
if( !mesh.driver ) return
mesh.onBeforeRender = function(){
let model = xrf.model
if( !model || !model.clock ) return
setMaterial( this, this.driver.position )
}
}
}
}
})
})

View file

@ -1,24 +1,26 @@
xrf.addEventListener('dynamicKeyValue', (opts) => {
let {scene,match,v} = opts
let materialName = v.fragment
let texture = v.fragment
scene.traverse( (mesh) => {
if( mesh.material){
if( mesh.material.map && mesh.material.name == materialName ){
if( mesh.material.map && mesh.material.map.name == texture ){
let mat = mesh.material
delete mesh.onBeforeRender
delete mesh.driver
if( v.x != undefined ){
mat.map.offset.x = v.x
mat.map.offset.y = v.y
mat.map.rotation = v.z
}else{
let driver = xrf.scene.getObjectByName(v.string)
if( !driver ) return
xrf.addEventListener('render', (opts) => {
mesh.driver = xrf.scene.getObjectByName(v.string)
if( !mesh.driver ) return
mesh.onBeforeRender = function(){
let model = xrf.model
if( !model || !model.clock ) return
mat.map.offset.x = driver.position.x
mat.map.offset.y = driver.position.y
mat.map.rotation = driver.position.z
})
this.material.map.offset.x = this.driver.position.x
this.material.map.offset.y = this.driver.position.y
this.material.map.rotation = this.driver.position.z
}
}
}
}

View file

@ -14,7 +14,9 @@ xrf.frag.t = function(v, opts){
mixer.setTime(time)
mixer.time = Math.abs(mixer.time)
mixer.update(0) // (forgetting) this little buddy costed me lots of time :]
// (re)trigger audio
xrf.model.animations.map( (anim) => {
anim.action.setLoop( v.z == 0 ? THREE.LoopOnce : THREE.LoopRepeat)
})
}
// play animations

View file

@ -50,6 +50,7 @@ class XRF {
public var x:Float; // |vector| x,y,z| comma-separated | #pos=1,2,3 |
public var y:Float;
public var z:Float;
public var w:Float;
public var color:String; // |string| color| FFFFFF (hex) | #fog=5m,FFAACC |
public var string:String; // |string| | | #q=-sun |
public var int:Int; // |int | | [-]x[xxxxx] | #price:>=100 |
@ -107,6 +108,7 @@ class XRF {
if( xyz.length > 0 ) v.x = Std.parseFloat(xyz[0]); // 1. anything else will be treated as string-value
if( xyz.length > 1 ) v.y = Std.parseFloat(xyz[1]); // 1. incompatible value-types will be dropped / not used
if( xyz.length > 2 ) v.z = Std.parseFloat(xyz[2]); //
if( xyz.length > 3 ) v.w = Std.parseFloat(xyz[3]); //
} // > the xrfragment specification should stay simple enough
// > for anyone to write a parser using either regexes or grammar/lexers
if( isColor.match(str) ) v.color = str; // > therefore expressions/comprehensions are not supported (max wildcard/comparison operators for queries e.g.)