flynx/ImageGrid
1
1
Fork 0
mirror of https://github.com/flynx/ImageGrid.git synced 2025-10-29 02:10:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

now .keyPress(..) works correcly + minor tweaks and fixes...

Browse Source 
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2019-06-18 20:58:40 +03:00
parent 5571860d80
commit bc14c0af00
3 changed files with 41 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
ui (gen4)/lib/keyboard.js
View File

@ -292,8 +292,7 @@ function isKey(key){
// key is either a key code or a valid key name... // key is either a key code or a valid key name...
return (!!parseInt(k) || key2code(k) != null) return (!!parseInt(k) || key2code(k) != null)
// mod must be a subset of modifiers... // mod must be a subset of modifiers...
&& mod.filter(function(m){ return modifiers.indexOf(m) < 0 }).length == 0 && mod.filter(function(m){ return modifiers.indexOf(m) < 0 }).length == 0 }
}
// Split key... // Split key...
@ -1188,7 +1187,7 @@ function makeKeyboardHandler(keyboard, unhandled, actions){
var res var res
//if(key instanceof Event || key instanceof $.Event){ //if(key instanceof Event || key instanceof $.Event){
if(typeof(key) != typeof('str')){ if(typeof(key) != typeof('str') && !(key instanceof Array)){
evt = key evt = key
key = kb.event2key(evt) key = kb.event2key(evt)
@ -1303,9 +1302,8 @@ var stoppableKeyboardRepeat =
module.stoppableKeyboardRepeat = module.stoppableKeyboardRepeat =
function(handler, check){ function(handler, check){
return function(evt){ return function(evt){
return check() && handler(evt) return check()
} && handler(evt) } }
}
// Event handler wrapper that will drop identical keys repeating at rate // Event handler wrapper that will drop identical keys repeating at rate

3
ui (gen4)/lib/widget/browse2.html
View File

@ -2,6 +2,9 @@
<html> <html>
<link rel="stylesheet" href="../../css/widget/browse.css"> <link rel="stylesheet" href="../../css/widget/browse.css">
<link rel="stylesheet" href="../../css/fonts.css"> <link rel="stylesheet" href="../../css/fonts.css">
<meta name="viewport" content="width=device-width">
<style> <style>
body { body {

51
ui (gen4)/lib/widget/browse2.js
View File

@ -3116,6 +3116,9 @@ var BrowserPrototype = {
noniterable: true, noniterable: true,
}, },
}, },
// debug and testing options...
//keyboardReportUnhandled: false,
}, },
@ -3140,6 +3143,17 @@ var BrowserPrototype = {
function(){ return that.dom }) function(){ return that.dom })
return kb }, return kb },
// NOTE: this is not designed for direct use...
get __keyboard_handler(){
var options = this.options || {}
return (this.____keyboard_handler = this.____keyboard_handler
|| keyboard.makePausableKeyboardHandler(
this.keyboard,
function(){
options.keyboardReportUnhandled
&& console.log('KEY:', ...arguments) },
this)) },
// parent element (optional)... // parent element (optional)...
// XXX rename??? // XXX rename???
@ -3286,6 +3300,7 @@ var BrowserPrototype = {
renderFinalize: function(items, context){ renderFinalize: function(items, context){
var that = this var that = this
var d = this.renderList(items, context) var d = this.renderList(items, context)
var options = context.options || this.options || {}
// wrap the list (nested list) of nodes in a div... // wrap the list (nested list) of nodes in a div...
if(d instanceof Array){ if(d instanceof Array){
@ -3296,19 +3311,20 @@ var BrowserPrototype = {
d = c d = c
} }
d.setAttribute('tabindex', '0') d.setAttribute('tabindex', '0')
// Setup basic event handlers... // Setup basic event handlers...
// keyboard... // keyboard...
d.addEventListener('keydown', // NOTE: we are not doing:
this.__keyboard_handler = this.__keyboard_handler // d.addEventListener('keydown', this.keyPress.bind(this))
|| keyboard.makePausableKeyboardHandler(this.keyboard, // because we are abstracting the user from DOM events and
function(){ console.log('KEY:', ...arguments) },//null, // directly passing them parsed keys...
this)) d.addEventListener('keydown', function(evt){
that.keyPress(that.keyboard.event2key(evt)) })
// focus... // focus...
d.addEventListener('click', d.addEventListener('click',
function(e){ function(e){
e.stopPropagation() e.stopPropagation()
d.focus() d.focus() })
})
/* XXX this messes up scrollbar... /* XXX this messes up scrollbar...
d.addEventListener('focus', d.addEventListener('focus',
function(){ function(){
@ -3344,7 +3360,7 @@ var BrowserPrototype = {
// XXX the way focus management is done here feels hack-ish... // XXX the way focus management is done here feels hack-ish...
renderList: function(items, context){ renderList: function(items, context){
var that = this var that = this
var options = context.options || this.options var options = context.options || this.options || {}
// dialog (container)... // dialog (container)...
var dialog = document.createElement('div') var dialog = document.createElement('div')
@ -3411,7 +3427,7 @@ var BrowserPrototype = {
// XXX register event handlers... // XXX register event handlers...
renderNested: function(header, children, item, context){ renderNested: function(header, children, item, context){
var that = this var that = this
var options = context.options || this.options var options = context.options || this.options || {}
// container... // container...
var e = document.createElement('div') var e = document.createElement('div')
@ -3499,7 +3515,7 @@ var BrowserPrototype = {
// XXX replace $X with <u>X</u> but only where the X is in item.keys // XXX replace $X with <u>X</u> but only where the X is in item.keys
renderItem: function(item, i, context){ renderItem: function(item, i, context){
var that = this var that = this
var options = context.options || this.options var options = context.options || this.options || {}
if(options.hidden && !options.renderHidden){ if(options.hidden && !options.renderHidden){
return null return null
} }
@ -3573,10 +3589,10 @@ var BrowserPrototype = {
}) })
// system events... // system events...
// XXX disable double click to make this faster...
elem.addEventListener('click', elem.addEventListener('click',
// XXX revise signature... function(evt){
// XXX should we trigger the DOM event or the browser event??? evt.stopPropagation()
function(){
that.open(item, text, elem) }) that.open(item, text, elem) })
//$(elem).trigger('open', [text, item, elem]) }) //$(elem).trigger('open', [text, item, elem]) })
//elem.addEventListener('tap', //elem.addEventListener('tap',
@ -3646,6 +3662,7 @@ var BrowserPrototype = {
// scroll... // scroll...
//
// XXX do we need this??? // XXX do we need this???
scrollTo: function(pattern, position){ scrollTo: function(pattern, position){
var target = this.get(pattern) var target = this.get(pattern)
@ -3752,10 +3769,10 @@ var BrowserPrototype = {
// Custom events... // Custom events...
// //
// XXX make this different from html event??? // NOTE: this is not directly connected to DOM key events...
// XXX trigger this from kb handler... keyPress: makeEventMethod('keypress',
keyPress: makeEventMethod('keypress', function(){ function(evt, key){
}), this.__keyboard_handler(key) }),
// XXX // XXX
menu: makeEventMethod('menu', function(){ menu: makeEventMethod('menu', function(){
}), }),