coderofsalvation/xrfragment
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

added accessibility: tab+enter navigation for quizz e.g.

Browse source
This commit is contained in:
Leon van Kammen 2024-06-17 13:53:47 +00:00
parent 2d521d8340
commit ced5383530
7 changed files with 14219 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
dist/xrfragment.aframe.all.js vendored
View file

@ -1,5 +1,5 @@
/* /*
* v0.5.1 generated at Mon Jun 17 12:41:29 PM UTC 2024 * v0.5.1 generated at Mon Jun 17 01:53:03 PM UTC 2024
* https://xrfragment.org * https://xrfragment.org
* SPDX-License-Identifier: MPL-2.0 * SPDX-License-Identifier: MPL-2.0
*/ */

2
dist/xrfragment.aframe.js vendored
View file

@ -1,5 +1,5 @@
/* /*
* v0.5.1 generated at Mon Jun 17 12:41:29 PM UTC 2024 * v0.5.1 generated at Mon Jun 17 01:53:03 PM UTC 2024
* https://xrfragment.org * https://xrfragment.org
* SPDX-License-Identifier: MPL-2.0 * SPDX-License-Identifier: MPL-2.0
*/ */

14193
dist/xrfragment.module.js vendored
View file

File diff suppressed because it is too large Load diff

18
dist/xrfragment.plugin.frontend.js vendored
View file

@ -343,10 +343,11 @@ window.accessibility = (opts) => new Proxy({
setupHrefCycling(){ setupHrefCycling(){
// speak arrow keys // speak arrow keys
window.addEventListener('keydown', (e) => { window.addEventListener('keydown', (e) => {
if( e.key != 'Tab') return console.log(e.key)
if( e.key != "Tab" && e.key != "Enter" ) return
let subScene = xrf.scene.getObjectByName( xrf.frag.pos.last ) let subScene = xrf.scene.getObjectByName( xrf.frag.pos.last )
if( !subScene ) subScene = xrf.scene if( !subScene ) subScene = xrf.scene
let cache = this.setupHrefCycling.cache = this.setupHrefCycling.cache || {current: 0} let cache = this.setupHrefCycling.cache = this.setupHrefCycling.cache || {current: -1}
let objects = [] let objects = []
subScene.traverse( (n) => (n.userData.href || n.userData['aria-description']) && objects.push(n) ) subScene.traverse( (n) => (n.userData.href || n.userData['aria-description']) && objects.push(n) )
@ -368,13 +369,16 @@ window.accessibility = (opts) => new Proxy({
notify(`${n.userData['aria-description']||''}` + (n.userData.href ? `<br><b>name:</b> ${n.name}<br><b>link:</b> ${n.userData['href']}` :'') ) notify(`${n.userData['aria-description']||''}` + (n.userData.href ? `<br><b>name:</b> ${n.name}<br><b>link:</b> ${n.userData['href']}` :'') )
} }
// ensure valid href if( e.key == 'Enter' && objects[cache.current].userData.href ){
cache.current = cache.current % objects.length xrf.navigator.to( objects[cache.current].userData.href )
highlight( objects[cache.current] ) }
console.log(objects[cache.current].userData.href)
// increment to next // increment to next
cache.current = cache.current + 1 cache.current = (cache.current + 1) % objects.length
if( e.key == 'Tab'){
highlight( objects[cache.current] )
}
e.preventDefault() e.preventDefault()
return false return false

2
dist/xrfragment.three.js vendored
View file

@ -1,5 +1,5 @@
/* /*
* v0.5.1 generated at Mon Jun 17 12:41:29 PM UTC 2024 * v0.5.1 generated at Mon Jun 17 01:53:03 PM UTC 2024
* https://xrfragment.org * https://xrfragment.org
* SPDX-License-Identifier: MPL-2.0 * SPDX-License-Identifier: MPL-2.0
*/ */

2
dist/xrfragment.three.module.js vendored
View file

@ -1,5 +1,5 @@
/* /*
* v0.5.1 generated at Mon Jun 17 12:41:29 PM UTC 2024 * v0.5.1 generated at Mon Jun 17 01:53:03 PM UTC 2024
* https://xrfragment.org * https://xrfragment.org
* SPDX-License-Identifier: MPL-2.0 * SPDX-License-Identifier: MPL-2.0
*/ */

18
src/3rd/js/plugin/frontend/accessibility.js
View file

@ -91,10 +91,11 @@ window.accessibility = (opts) => new Proxy({
setupHrefCycling(){ setupHrefCycling(){
// speak arrow keys // speak arrow keys
window.addEventListener('keydown', (e) => { window.addEventListener('keydown', (e) => {
if( e.key != 'Tab') return console.log(e.key)
if( e.key != "Tab" && e.key != "Enter" ) return
let subScene = xrf.scene.getObjectByName( xrf.frag.pos.last ) let subScene = xrf.scene.getObjectByName( xrf.frag.pos.last )
if( !subScene ) subScene = xrf.scene if( !subScene ) subScene = xrf.scene
let cache = this.setupHrefCycling.cache = this.setupHrefCycling.cache || {current: 0} let cache = this.setupHrefCycling.cache = this.setupHrefCycling.cache || {current: -1}
let objects = [] let objects = []
subScene.traverse( (n) => (n.userData.href || n.userData['aria-description']) && objects.push(n) ) subScene.traverse( (n) => (n.userData.href || n.userData['aria-description']) && objects.push(n) )
@ -116,13 +117,16 @@ window.accessibility = (opts) => new Proxy({
notify(`${n.userData['aria-description']||''}` + (n.userData.href ? `<br><b>name:</b> ${n.name}<br><b>link:</b> ${n.userData['href']}` :'') ) notify(`${n.userData['aria-description']||''}` + (n.userData.href ? `<br><b>name:</b> ${n.name}<br><b>link:</b> ${n.userData['href']}` :'') )
} }
// ensure valid href if( e.key == 'Enter' && objects[cache.current].userData.href ){
cache.current = cache.current % objects.length xrf.navigator.to( objects[cache.current].userData.href )
highlight( objects[cache.current] ) }
console.log(objects[cache.current].userData.href)
// increment to next // increment to next
cache.current = cache.current + 1 cache.current = (cache.current + 1) % objects.length
if( e.key == 'Tab'){
highlight( objects[cache.current] )
}
e.preventDefault() e.preventDefault()
return false return false